jqueryで選択した要素を取得する方法

Web 開発で非常に一般的に使用される JavaScript ライブラリである jQuery には、Web ページ内の要素を簡単に取得して操作できる強力で豊富な API があります。 jQuery は、HTML ドキュメント内の要素を選択するための一連のセレクターを提供します。実際の開発ではユーザーの操作に基づいて選択要素を取得する必要がありますが、この記事ではjQueryで選択要素を取得する方法を紹介します。

1. 基本セレクター

基本セレクターは、jQuery の最も基本的なセレクターです。基本的なセレクターを使用して、すべての DOM 要素、要素タイプ、クラス、ID などを選択できます。一般的に使用される基本的なセレクターは次のとおりです:

1. *：选择所有元素
2. #id：根据id选择元素
3. .class：根据class选择元素
4. element：选择元素类型
5. [attribute]：选择有某个属性的元素
6. [attribute=value]：选择某个属性等于给定值的元素

2. 階層セレクター

階層セレクターは、指定された要素または要素グループ内にネストされた要素を選択するために使用できます。一般的に使用される階層セレクターは次のとおりです:

1. ancestor descendant：选择某元素内的后代元素
2. parent > child：选择某元素的直接子元素
3. prev + next：选择某元素之后的紧邻的兄弟元素
4. prev ~ siblings：选择某元素之后的所有兄弟元素

3. フィルター セレクター

フィルター セレクターは、セレクターに特定の属性があるかどうか、要素が存在するかどうかなど、ステータスに基づいて要素を選択できます。特定の状態 (表示または無効など)、ノードの位置などの条件。一般的に使用されるフィルター セレクターは次のとおりです。

1. :first、:last：选择第一个、最后一个元素
2. :not(selector)：选择不符合条件的元素
3. :even、:odd：选择偶数或奇数元素
4. :disabled、:enabled：选择被禁用、可用的元素
5. :checked：选择被选中的元素
6. :selected：选择被选择的元素

4. 選択した要素を取得します

jQuery で選択した要素を取得するには、主に 2 つの方法があります。

1. Useフォーム要素の val() メソッド

選択した要素がフォーム要素 (input、textarea など) の場合、val() メソッドを直接使用して、選択された要素の値、コードは次のとおりです。

var value = $("input:checkbox:checked").val();

上記のコード パラメーター input:checkbox:checked は、チェックされたすべてのチェックボックス要素が選択され、val() メソッドを使用してそれらの値を取得することを意味します。

2. セレクターとイベント処理関数の使用

選択した要素がフォーム要素ではない場合、セレクターとイベント処理関数を通じて選択した要素を取得できます。コードは次のとおりです:

// 给被选中的元素绑定click事件
$("p").click(function() {
  $(this).toggleClass("selected");
});

// 获取被选中的元素
var selected = $("p.selected");

上記のコードでは、 click() メソッドを使用してクリック イベントを選択した要素にバインドします。要素がクリックされると、選択したクラス名が追加または削除されます要素から。要素が選択されているか、チェックされていないことを示します。最後に、セレクターを使用して、選択された要素を取得します。

概要: jQuery で選択された要素を取得するには、基本セレクター、階層セレクター、フィルター セレクターを使用するか、val() メソッドと form 要素のイベント処理関数を通じて選択された要素を取得できます。これらの方法をマスターすると、Web ページ内の要素を簡単に操作できるようになります。

以上がjqueryで選択した要素を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。