通过循环添加不同的分类答案

【问题标题】：Adding different classed through looping通过循环添加不同的分类
【发布时间】：2012-10-16 11:11:57
【问题描述】：

我有许多li 元素，我需要一个到第 1、第 4 和第 7、第 2、第 5 和第 8 以及第 3、第 6 和第 9 的类。

这个可以吗？

【问题讨论】：

【解决方案1】：

应该这样做...

var classes = ["first_group", "second_group", "third_group"];

$("li").addClass(function(i) {
    return classes[i % 3];
});

【讨论】：

Tnx 亚历克斯：。如果你不介意你能解释一下这行'return classes[i % 3];'
@aneeshraj 模数运算符。它返回除法的余数。通过将每个索引除以3 并得到余数，我们将得到一个介于0 和2 之间的数字，它与我们数组的索引一致。

【解决方案2】：

你可以使用:nth-child()选择器：

$("li:nth-child(3n+1)").addClass("one");
$("li:nth-child(3n+2)").addClass("two");
$("li:nth-child(3n+3)").addClass("three");

演示： http://jsfiddle.net/vDTWn/

【讨论】：

visioN .tnx.. 但出现一个语法错误。你能检查一下吗
@aneeshraj 它应该可以正常工作。检查您是否正确使用了代码。
@VisioN：您的答案包含可怕的 jsFiddle 隐形字符。就在最后一个;之后。
我假设您将代码粘贴到来自 jsFiddle 的答案中。无论如何，无论它来自哪里，您在该位置都有一个不可见的字符，这会在某些浏览器中导致 SyntaxError。如果你编辑你的答案，把光标放在最后一个; （确保你向右走足够远），然后按几次左箭头键，你会注意到它暂停一键。这就是角色所在的地方。
@user1689607 太棒了。我第一次在 SO 中遇到这个问题。谢谢！