0

jQuery を使用すると、次のように連続した数値クラスをリスト項目に追加できます。

  $(".item-list li").each(function (i) {
      $(this).addClass("item-list-" + i);
   });

したがって、HTML 構造は次のようになります。

<ul class="item-list">
  <li>an item</li>
  <li>another item</li>
  <li>another item</li>
  <li>another item</li>
  <li>another item</li>
</ul>

...これは、Niceリストアイテムクラスを番号順に出力します：

class="item-list-0"
class="item-list-1"

...など...

私がやろうとしているのは、アイテムの数を 4 までにしてから、番号付けをゼロからやり直すことです。nth数値+ iコード内で子を使用する必要があると考えましたが、これに関するドキュメントを見つけることができませんでした。私が見つけたものはすべて、n 番目の要素を見つけることに関連していますが、指定された量の後にカウントオーバーを開始することはありません。

4

1 に答える 1

2

モジュラス演算子自体を使用してこれを行うことができます：

$(".item-list li").each(function (i) {
    $(this).addClass("item-list-" + (i%4));
});

出力マークアップ

<ul class="item-list">
    <li class="item-list-0">an item</li>
    <li class="item-list-1">another item</li>
    <li class="item-list-2">another item</li>
    <li class="item-list-3">another item</li>
    <li class="item-list-0">another item</li>
    <li class="item-list-1">another item</li>
    <li class="item-list-2">another item</li>
    <li class="item-list-3">another item</li>
    <li class="item-list-0">another item</li>
</ul>

デモ

于 2013-06-13T21:14:27.147 に答える