0

代わりに 2 つの css クラスを追加したいリストがあります - (classOneと classTwo) jQuery で。

<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>

4

2 に答える 2

3

これを試して、

$(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/からのソース

于 2013-06-12T10:41:39.130 に答える
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';
});
于 2013-06-12T10:41:02.480 に答える