jQuery 遍历 - eq() メソッド

jQuery 遍历参考手冊

例

index が 2 の div に適切なクラスを追加して、それを青色にします：

$("body").find("div").eq(2).addClass("blue");

自分で試してみてください

定義と用法

eq() メソッドは指定された index 上の要素集を縮小します。

文法

.eq(index)
パラメータ 説明
index

整数、要素の位置を示します（最小値は 0）。

負の数の場合、集合の最後から数えます。

詳細な説明

DOM 元素集合を表す jQuery オブジェクトが指定された場合、.eq() メソッドは集合内の要素から新しい jQuery オブジェクトを構築します。使用される index パラメータは、集合内の要素の位置を示します。

以下の簡単なリストをご覧ください：

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

例 1

この方法をこのリストアイテムセットに適用できます：

$('li').eq(2).css('background-color', 'red');

自分で試してみてください

この呼び出しの結果、プロジェクト 3 に赤色の背景が設定されます。index はゼロベースで、jQuery オブジェクト内の要素の位置を指し示しますが、DOM 木内の位置ではありません。

例 2

負の数が提供された場合、集合の終わりから始まる位置を指し示します。例えば：

$('li').eq(-2).css('background-color', 'red');

自分で試してみてください

今度は、プロジェクト 4 の背景が赤色に変わります。これは、集合の終わりから始まる二番目の要素であるためです。

例 3

指定された index パラメータに基づいて要素が見つからない場合、该方法は空集合を持つ jQuery オブジェクトを構築し、length 属性が 0 になります。

$('li').eq(5).css('background-color', 'red');

自分で試してみてください

ここでは、リストアイテムが赤色に変わりません。これは、.eq(5) で指定された第六のリストアイテムによるものです。

jQuery 遍历参考手冊