Question

我有一个列表，我想在其中添加2个css类 - （classOne和 jQuery中的classTwo}。

<ul>
<li>el 1 </li>
<li>el 2 </li>
<li>el 3 </li>
<li>el 4 </li>
<li>el n </li>
</ul>

我想得到这个

<ul>
<li class="classOne">el 1 </li>
<li class="classtwo">el 2 </li>
<li class="classOne">el 3 </li>
<li class="classTwo">el 4 </li>
<li class="classOne">el n </li>

Answer 1

试试这个，

$(function(){
    $('li:odd').addClass('classOne');
    $('li:even').addClass('classtwo');
});

小提琴http://jsfiddle.net/DrZYQ/

已更新以获得更好的效果，

或者你可以尝试一下，

$(function(){
    $('li').filter(':odd').addClass('classOne');
    $('li').filter(':even').addClass('classtwo');
});

来自http://api.jquery.com/filter/

的来源

Answer 2

如果这是出于样式原因，只要你的目标是相对现代的浏览器，就不需要使用jQuery：

li:nth-child(2n + 1) {
    /* some styles */
}
li:nth-child(2n) {
    /* some other styles */
}

如果你真的需要这些类，那么使用jQuery相对容易。您可以使用上面的选择器来完成它，但这可能会更慢。最快的方式可能就是：

$('li').addClass(function(idx) {
    return (idx % 2 === 0) ? 'classOne' : 'classTwo';
});

在jquery </li>中添加同一列表的<li>元素中的类

2 个答案: