将类"last"添加到每个分区编号 4、8、12、16 等

Question

如何将类"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>

谢谢。

Answer 1

$('#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 */
 }

Answer 2

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

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

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

现场示例 | 来源

这是因为即使div:nth-child(4n)看起来像是每四个div，它也没有;它意味着div是其父容器中的第4个，第8个等元素。所以如果你把其他人扔进去，它是行不通的。

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

Answer 3

你可以这样做

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

这是运行示例

在此处查找示例

希望它有帮助...