4

如何将“last”类添加到每个 div 编号 4 、 8 、 12 、 16 等。我认为这不是什么大问题，对吧？

前 ：

<div id="main">
    <div>Element 1</div>
    <div>Element 2</div>
    <div>Element 3</div>
    <div>Element 4</div>
    <div>Element 5</div>
    <div>Element 6</div>
    <div>Element 7</div>
    <div>Element 8</div>
    <div>Element 9</div>
    <div>Element 10</div>
    <div>Element 11</div>
    <div>Element 12</div>
</div>

后

<div id="main">
    <div>Element 1</div>
    <div>Element 2</div>
    <div>Element 3</div>
    <div class="last">Element 4</div>
    <div>Element 5</div>
    <div>Element 6</div>
    <div>Element 7</div>
    <div class="last">Element 8</div>
    <div>Element 9</div>
    <div>Element 10</div>
    <div>Element 11</div>
    <div class="last">Element 12</div>
</div>

谢谢。

4

3 回答 3

11 
$('#main > div:nth-child(4n)').addClass('last');

小提琴示例：http: //jsfiddle.net/T7fE6/

注意：如果您必须对这些元素应用一些样式（并且您不支持 IE8 或以前的 IE 浏览器），您可以简单地将该选择器定义到您的 CSS 中，例如

 #main > div:nth-child(4n) {
     /* supported by IE9+ and all modern browser */
 }
于 2012-05-21T07:37:04.853 回答
2

如果您的标记真的只是 div元素，那么F. Calderan 的答案就是要走的路。

如果您可能还有其他元素并且您想忽略它们，您可以这样做：

$("#main > div").filter(function(index) {
  return index % 4 === 3;
}).addClass("last");

实例| 资源

那是因为即使div:nth-child(4n) 看起来它意味着每四个 div，但它不是；这意味着 div 是其父容器中的第 4 个、第 8 个等元素。所以如果你把其他人扔在那里，它就行不通了。

但同样，如果你只有divs，F 的答案就是要走的路。

于 2012-05-21T07:41:16.313 回答
2

你可以这样做

$(document).ready(function(){
 $('#main div').each(function(e){
     if((e+1) % 4 == 0){
         $(this).addClass('last');
     }
 });
})
​

这是正在运行的示例

在此处查找示例

希望它有帮助...

于 2012-05-21T07:44:41.743 回答