ホームページ >ウェブフロントエンド >フロントエンドQ&A >jquery の 3 種類のセレクターとは何ですか?
Jquery の 3 つのセレクター: 1. 要素 ID、要素名、クラス名、および複数のセレクターで構成される基本セレクター、2. DOM 要素間の階層関係を通じて要素を取得する階層セレクター、3. フィルター セレクターさまざまなフィルタリング ルールに従って、このセレクターは、単純なフィルタリング、コンテンツ フィルタリング、表示フィルタリング、属性フィルタリング、フォーム フィルタリングなどに分割することもできます。
このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。
要素 ID、要素名、および複数のセレクターで構成され、ほとんどのページ要素は基本セレクターを通じて検索できます
セレクター | 関数の説明 |
---|---|
id | 指定された ID に基づいて一致する要素 |
element | 指定された要素名に基づいてすべての要素に一致します |
.class | 指定されたクラスに基づいて要素に一致します |
* | すべての要素に一致します |
selector1、selectorN | 各セレクターに一致する要素を結合します |
階層セレクターは、DOM 要素間の階層関係を通じて要素を取得します。その主な階層関係には、子孫、父と子、隣接、兄弟の関係。特定のタイプの関係を使用して、要素を便利かつ迅速に見つけることができます。
関数の説明 | |
---|---|
Match祖先要素に基づくすべての子孫要素 | ##親>子 |
## 前 次 | prev 要素の直後のすべての隣接要素と一致します |
pre~siblings | pre 要素の後のすべての兄弟要素と一致します |
3. フィルター セレクター |
##Selector
関数の説明
##first() または :first | 最初の要素を取得します |
---|---|
最後の要素を取得します | |
指定されたセレクターを除くすべての要素を取得します | |
すべての要素を取得します偶数のインデックス値の場合、インデックス番号は 0 | |
奇数のインデックス値を持つすべての要素を取得します。インデックス 番号は 0 | から始まります。 |
指定されたインデックス値を持つ要素を取得します。インデックス番号は 0 から始まります | #:gt(index) |
#:lt(index) | |
:header | |
:animated | |
コンテンツ フィルタリング セレクターは、要素内のテキスト コンテンツまたはそれに含まれるサブ要素の特性に基づいて要素を取得します。テキスト コンテンツは、要素の位置が完全にあいまいであることも、完全に一致することもあります |
関数の説明
テキストを取得指定されたテキストを含む Elements | |
---|---|
:has(selector) | |
:parent | |
#可視性フィルターセレクターは、要素が可視かどうかの特性に基づいて要素を取得します |
関数の説明
:visble | ||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
[attribute=value] | 指定された属性と等しい属性を取得します特定の値を持つ Element |
---|---|
指定された属性と等しくなく、特定の値である要素を取得します | |
属性が特定の値で始まる要素を取得 | ##[attribute$=value] |
##[属性*=値] | |
#[selector1][selector2][selectorN] | 複数の条件を満たす属性を満たす要素を取得する |
##5) サブ要素フィルター | |
#セレクター | |
:first-child から始まります。各親要素の下の最初の子要素
:last-child | 各親要素の下の最後の子要素を取得します |
---|---|
各親要素の下にある子要素を 1 つだけ取得します | |
6) フォーム オブジェクトの属性フィルター | フォーム オブジェクト属性フィルター セレクターは、有効、無効、チェック済み、選択された属性など、フォーム内のオブジェクトの属性特性を通じて要素を取得します。 |
#セレクター | 関数の説明 |
##:enabled |
#:disabled
使用できない属性を持つすべての要素を形式フォーム内のすべての選択された要素を取得します | |
---|---|
フォーム用に特別に設計されたフォーム セレクターを jQuery セレクターに導入し、ページ上のフォーム オブジェクトをすばやく見つけることができます。 | |
関数の説明 | |
:input | #すべての入力を取得、textarea、select |
すべての単一行テキスト ボックスを取得
:password#:radio | #すべてのラジオ ボタンを取得 |
---|---|
:送信 | |
:画像 | |
:reset | |
#:button | |
:file | |
、 | ウェブ フロントエンド ビデオ] |
以上がjquery の 3 種類のセレクターとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。