jQueryのindexofメソッド

jQuery は、DOM、イベント、AJAX などの操作を処理するための便利なメソッドを多数提供する人気の JavaScript ライブラリです。メソッドの 1 つとして、jQuery は、親要素内で一致する要素の位置を見つけるために使用できる、indexOf() メソッドを提供します。この記事では、jQueryのindexOf()メソッドの使い方と例を詳しく紹介します。

jQuery.indexOf() メソッドは、親要素内の要素の位置を見つけるために使用される jQuery オブジェクトのメソッドです。以下は、jQuery.indexOf() メソッドを使用するための基本的な構文です。

$(selector).index(element)

ここで、selector は jQuery セレクター、element は要素です。見つける必要があるオブジェクト、またはセレクター式。 element パラメーターが指定されていない場合は、親要素内の最初に一致した要素の位置を返します。それ以外の場合は、親要素内の指定された要素の位置を返します。インデックス値は0から始まることに注意してください。

jQuery.indexOf() メソッドの例をいくつか見てみましょう:

例 1:

次の例では、ソートされていないリスト内で一致するものを見つけます。要素。

HTML コード:

• リンゴ


• バナナ


• orange

JavaScript コード:

varindex = $('li').index($('li:contains("banana" )'));
console.log(index);

出力結果: 1
// リスト内の 'banana' 要素の位置は 1 (0 から数えて)

例 2:

次の例では、親要素内で最初に一致する要素の位置を見つけます。

HTML コード:

JavaScript コード:

varindex = $('.parent').index($(' .parent >span:first'));
console.log(index);

出力結果：0
// 親要素内の最初のspan要素の位置は0です(カウントは 0 から開始します)

例 3:

次の例では、親要素内で 2 番目に一致する要素の位置を見つけます。

HTML コード:

JavaScript コード:

varindex = $('.parent').index($(' .parent >span:eq(1)'));
console.log(index);

出力結果: 1
// 親要素の 2 番目の span 要素の位置は1 (0 から数えます)

例 4:

jQuery.indexOf() メソッドを使用して、jQuery オブジェクト内の要素の位置を見つけることもできます。

HTML コード:

• リンゴ


• バナナ


• orange

JavaScript コード:

var $list = $('li');
varindex = $list.index( $list.filter(':contains("banana")'));
console.log(index);

出力結果: 1
// 'banana' 要素はjQuery オブジェクト 位置は 1 (0 から数えます)

概要:

jQuery.indexOf() メソッドは、親内の要素を簡単に見つけることができる、jQuery ライブラリの非常に実用的なメソッドです。要素または jQuery オブジェクト内の位置。この記事で提供されている例を通じて、indexOf() メソッドの使用の単純さと便利さがわかります。次の jQuery プロジェクトでこの方法を試してみてください。時間と労力を大幅に節約できます。

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