1回目と4回目のアイテムにクラスを適用する

Question

私は16アイテムのリストを持っています。各行に4つの項目がある4つの行があります。 各行の最初の項目に '.first'クラスを追加し、各行の4番目の項目に '.fourth'を追加するにはどうすればよいですか。

結果：

<ul> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
</ul> 

Answer 1

これを試してみてください：

$(function(){ 
    // You can use a more specific li selector as per your requirement 
    $("li").each(function(a, b){ 
     if(a%4 == 0){ 
      $(b).addClass("first"); 
     } 
     if(a%4 == 3){ 
      $(b).addClass("fourth"); 
     } 
    }); 
}); 

EDIT：

n番目の子を使用する：

$(function(){ 
    var ul = $("ul");//You can use more specific UL 
    ul.find(":nth-child(4n-3)").addClass("first"); 
    ul.find(":nth-child(4n)").addClass("fourth"); 
}); 

の作業例：http://jsfiddle.net/qmHNQ/

Answer 2

あなたはCSSセレクタを使用したいように聞こえる：n番目の子か：n番目の-の型。それらをjQueryで使用してクラスを追加することも、擬似クラスとして直接使用して追加の属性を追加することもできます。

Answer 3

を使用し、各（）：http://api.jquery.com/jQuery.each/

jQuery.each('ul li', function(indexInArray, valueOfElement){ 
    if ((indexInArray % 4) == 0) { $(this).addClass('first'); } 
    if ((indexInArray % 4) == 3) { $(this).addClass('fourth'); } 
}); 

Answer 4

"：even"フィルタを2回使用することができますか？初めて、あなたは、2で割り切れるすべてのものを取得する第二になります。でも、あなたはそれのすべて追いついを与えるだろう...割り切れる4.

$("li:gt(0):even:even").addClass("fourth"); 

により第一、第五、などを設定するには...あなたはおそらく最初のもの以外のすべての李を得ることができ、クラスを "最初に"適用することができます。次に、最初のものも設定します。

$("li:first").addClass("first"); 
$("li:gt(1):even:even").addClass("first"); 

[OK] ...これは機能しますが、1つのようだったようです。これはうまくいくはずです。