検索

ホームページ >ウェブフロントエンド >jsチュートリアル >JQuery の要素を取得するメソッドの概要

JQuery の要素を取得するメソッドの概要

小云云
小云云オリジナル
2017-12-05 09:59:302085ブラウズ

1. 説明

要素を取得するには、jQuery セレクターと jQuery トラバーサル関数の 2 つの方法があります。この記事では、皆様のお役に立てればと思い、JQuery の要素を取得する方法の概要を共有します。

要約を作成して知識を統合します。

2番目に、それ自体を取得します

1. 必要なjQueryセレクターは1つだけです

selector インスタンス 手順
#ID $( '# myId') ID セレクター: ID が「myId」の要素を取得できます。大文字と小文字は区別されます

2. さまざまな jQuery セレクターの組み合わせ

は 2 つの部分に分かれています:前半は要素のコレクションを取得し、後半は 2 つの要素を組み合わせて目的の要素を取得できます。 class

$('.myClass')

クラスセレクター: クラス 'myClass' ですべての要素を取得できますelementすべての

要素を取得します

:headerすべてのタイトル要素を取得:

~

:animated$(':animated')すべてのアニメーション要素を取得= 属性 href および値 a.html を持つすべての要素を取得します ! = 属性 href を持つすべての要素を取得します。値は a.html と等しくありません $= 属性 href を持つすべての要素を取得します。値は a.html で終わります ^= 属性を持つすべての要素を取得しますhref であり、値は a.html で始まります。 要素 ~= 属性 href があり、値に単語「a.html」が含まれるすべての要素を取得します。 *= 属性 href があり、値にテキストが含まれるすべての要素を取得します"a.html" $(':input'):enabled:checked 要素要素
$('p') $(':header')
:contains(text)$ ('p:contains(Hello)') テキスト Hello を含むすべての

要素を取得します。中央のテキストは大文字と小文字が区別されます

: hidden $(':hidden') すべての非表示要素を取得:幅と高さは 0、display:none、type=hidden、
[attribute] $('[href]') 属性セレクター: 属性 href を持つすべての要素を取得します
[attribute=value] $('[href=a.html]')
:input
すべての入力要素を取得 :radio

$(':radio')

型を持つすべての入力要素="radio"

類似のものは次のとおりです:

:text、:chexbox、:password、:submit、:reset、:button、:file
$(':enabled') すべての有効な入力要素。 :disabled はその逆です
$(':checked') 選択されたすべての入力選択 (ラジオ ボックス、チェック ボックス)

:gt(index)

$('p :gt (2)')

index は 0 から始まり、2 より大きい (含まれない) インデックスを持つすべての

要素を取得します
:lt(index) $('p:lt(2)' ) インデックスは 0 から始まり、インデックスが 2 未満のすべての

要素を取得します
:even $('tr:even') 偶数のすべての
:odd$('tr:odd')すべての奇数

2) セレクターの後半: 特定の要素に正確に指定できます

Selector

例

説明

:最初

$('p:first')

first

要素

:last

$('p:last')

last

要素

:eq(index)$("p:eq(1)")
2 番目の

要素、インデックスは 0 から始まります

3. jQuery セレクター + トラバーサル関数

も 2 つの部分に分かれています。前半はセレクターを使用して要素のセットを取得し、後半はトラバーサル関数を使用して特定の要素を正確に選択します

1）前半の部分は上記と同じです2）後半：トラバーサル関数

メソジ選択された要素の指定されたインデックス番号 first() last() 選択された要素の最後の要素を返します3. 兄弟要素を取得します 名前が示すように、選択された要素
選択された要素の最初の要素を返します
の

兄弟

要素を取得します。まず、要素を見つけて (

上でまとめたので繰り返しません

)、次にその兄弟要素を取得する必要があります。

1) セレクター

セレクターインスタンス

説明$('p + p')$('p ~ p') は p と同じレベルのすべての

要素を取得します

説明
要素 + 次 各 p は隣接しています。次の < p> 要素 element ~兄弟
2) トラバーサル関数
メソッド

next()

選択された要素の次の兄弟要素を返します

nextAll()選択した要素の前の兄弟要素を返しますprevAll()選択した要素の前のすべての兄弟要素を返します 4. 入手親要素の親要素
選択された要素の後のすべての要素を返します兄弟要素 prev()
選択された要素

を取得する 1) セレクター

セレクター

例

説明

:親$ ('p:parent') 2) トラバーサル関数メソッド 説明
全てのp要素の親要素を取得

親()

選択した要素の親要素を取得します


parents()

選択した要素のすべての祖先要素を取得します 子 要素を取得する 1) セレクター
5. 子要素を取得します
選択された要素の

セレクター

インスタンス

説明

親>子 $('p > p') 2) トラバーサル関数MethodDescription
p の直接の子要素のすべての

要素を取得します

親の子孫 $('p p') p のすべての子孫の

要素を取得します


children()

選択された要素の直接の子要素をすべて返します

内容()返品選択した要素のすべての直接の子要素(テキストノードとコメントノードを含む)find()関連する推奨事項: jquery は要素を取得します。index() メソッドの例の詳細な説明 jquery は要素を取得し、要素をラップし、要素属性の使用法の詳細を挿入します
選択した要素の子孫要素を返します
上記の内容は概要ですJQuery の要素を取得する方法について、皆さんのお役に立てれば幸いです。

jquery メソッドは要素の値を取得します (共通フォーム要素)_jquery

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

声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：JS_javascript スキルに実装されたカウントソートおよび基数ソートアルゴリズムの例次の記事：JS_javascript スキルに実装されたカウントソートおよび基数ソートアルゴリズムの例

関連記事

続きを見る