这是我的DOM.我需要选择中间的三列,跳过一个节点,重复：
+-------------------+ <div class="grid"> | +---+ +---+ +---+ | <div class="cell">1</div> | | 1 | | 2 | | 3 | | <div class="cell">2</div> | +---+ +---+ +---+ | <div class="cell">3</div> | +---+ +---+ +---+ | <div class="cell">4</div> | | 4 | | 5 | | 6 | | <div class="cell">5</div> | +---+ +---+ +---+ | <div class="cell">6</div> | +---+ +---+ +---+ | <div class="cell">7</div> | | 7 | | 8 | | 9 | | <div class="cell">8</div> | +---+ +---+ +---+ | <div class="cell">9</div> | +---------------+ | | | AD UNIT | | <div class="adUnit"></div> | +---------------+ | | +---+ +---+ +---+ | <div class="cell">11</div> | | 11| |12 | |13 | | <div class="cell">12</div> | +---+ +---+ +---+ | <div class="cell">13</div> | +---+ +---+ +---+ | <div class="cell">14</div> | |14 | |15 | |16 | | <div class="cell">15</div> | +---+ +---+ +---+ | <div class="cell">16</div> | +---+ +---+ +---+ | <div class="cell">17</div> | |17 | |18 | |19 | | <div class="cell">18</div> | +---+ +---+ +---+ | <div class="cell">19</div> | +---------------+ | | | AD UNIT | | <div class="adUnit"></div> | +---------------+ | | +---+ +---+ +---+ | <div class="cell">21</div> | |21 | |22 | |23 | | <div class="cell">22</div> | +---+ +---+ +---+ | <div class="cell">23</div> | +---+ +---+ +---+ | <div class="cell">24</div> | |24 | |25 | |...| | <div class="cell">25</div> | +---------------+ | <!-- ... --> +-------------------+ </div>
tldr
我需要选择以下序列[children节点]：
2,5,8,12,15,18,22,25,28,32,35,38,...
我已经实现了三个独立的第n个孩子的功能：
> .grid .cell：nth-child(10n 2)(2,…)
> .grid .cell：nth-child(10n 5)(5,…)
> .grid .cell：nth-child(10n 8)(8,…)
题：
这三个功能是否可以重写成一个？
解决方法
事实证明,没有办法使用第n个孩子或第n个类型来做你以后的类型,看你选择什么类型的元素,而不是类.
如果您可以更改广告单元的元素类型,可以使用第n种类型,例如：
<div class="cell">1</div> <aside class="adUnit"></aside> <div class="cell">2</div>
如果你可以做出这个改变,那么第n个类型应该允许你定位你的div而不是asides,例如：
.grid > div.cell:nth-of-type(3n+2) { }
编辑：根据web-tiki的评论调整选择器.
