我如何添加 2、5、8 类等数字 div答案

【问题标题】：how can i add class 2,5,8 etc number div我如何添加 2、5、8 类等数字 div
【发布时间】：2014-03-25 04:03:15
【问题描述】：

我正在创建画廊，下面是示例 html 代码

<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>


<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>


<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>

<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>


<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>



<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>



<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>


<div class="probox">
         <img src="pro/th/Chair.jpg" />
          <h2>Chair</h2>
      </div>

好的，主要是在我的页面中每行显示 3 个缩略图，所以我想在每行第二个 div 中添加类。像第 1 行第 2 格第 2 行第 2 格...所以这意味着第 2 格下一个第 5 格下一个第 8 格等..

或者如果如何为每个 3rd div 添加类.. 比如 3rd div、6th div、9th div 等。

http://jsfiddle.net/cyber007/Wj5fd/

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

试试，

$('.productsarea .probox:nth-child(3n)').addClass('yourClass');

DEMO

【讨论】：

【解决方案2】：

只需更改您的脚本如下：

jQuery('.productsarea').find('div.probox').each(function(i,e){
   if(i%3==0) $(e).addClass('last');
});

JSFiddle

【讨论】：

【解决方案3】：

我认为您正在寻找的是 CSS 选择器：selector:nth-of-type(formula)。这是example。如果您希望每个 3rd div（或任何您的选择器）具有某些功能，那么您将使用以下内容：

div:nth-of-type(3n) {
    //your CSS code here
}

公式的形式为an + b，解释为here。基本上，b 是偏移量，a 是斜率（就像代数一样）。它使用索引表示法，因此该选择器适合的第一个元素为零。因此，如果您想从第二个元素开始点击每个第三个元素，您可以使用公式3n + 1。

【讨论】：