jQueryのeqメソッドの使い方を詳しく解説

jQuery の eq() メソッドは、一致する要素コレクション内の指定されたインデックス位置にある要素を選択するために使用されます。 jQuery では、インデックスは 0 から始まります。 eq() メソッドの構文は次のとおりです。

$("selector").eq(index)

ここで、「selector」はフィルタリングされる要素のコレクション、index は要素のインデックス位置です。選ばれること。 eq() メソッドの使用法については以下で詳しく説明し、具体的なコード例を示します。

1. 基本的な使用法

まず、複数の div 要素を含むページがあると仮定して、簡単な例を見てみましょう:

<div>第一个div</div>
<div>第二个div</div>
<div>第三个div</div>
<div>第四个div</div>

次に、For を選択します。 2 つの div 要素がある場合は、eq() メソッドを使用できます。

$("div").eq(1).css("color", "red");

上記のコードは 2 番目の div 要素を選択し、そのテキストの色を赤に変更します。インデックスは 0 からカウントし始めるため、2 番目の要素のインデックスは 1 になることに注意してください。

2. 複数の要素の選択

隣接しない複数の要素を選択する場合は、 eq() メソッドのパラメーターとして配列を渡すことができます。たとえば、最初と 3 番目の div 要素を選択したいとします。

$("div").eq([0, 2]).css("font-weight", "bold");

上記のコードは、最初と 3 番目の div 要素を選択し、そのフォントを太字にします。

3. 他のセレクターとの組み合わせ

eq() メソッドを他のセレクター メソッドと組み合わせて使用​​すると、より柔軟な要素の選択を実現できます。たとえば、クラス「example」を持つすべての div 要素の中から 2 番目の要素を選択できます。

$("div.example").eq(1).addClass("highlight");

上記のコードは、クラス「example」クラスを持つすべての div 要素のうちの 2 番目の要素にハイライトを追加して、特別なスタイルを実現します。効果。

4. チェーン呼び出し

eq() メソッドはチェーン呼び出しをサポートしており、複数のフィルターの後の最後の要素を選択できます。たとえば、最初にすべての div 要素を選択し、次にその中の 3 番目の要素を選択します。

$("div").eq(2).addClass("selected").css("background-color", "yellow");

上記のコードは、すべての div 要素を選択し、次にその中の 3 番目の要素を選択し、選択したクラスをそれに追加します。背景色は黄色に設定されています。

上記の例を通して、eq() メソッドの柔軟性と利便性がわかります。単一要素の選択であっても、複数の要素の選択であっても、 eq() メソッドはニーズを満たすことができ、他のセレクター メソッドと組み合わせて使用​​して、より複雑な要素のスクリーニング効果を実現できます。実際の開発では、eq() メソッドを柔軟に使用することでコードの読みやすさと効率を向上させることができます。

以上がjQueryのeqメソッドの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。