ホームページ  >  記事  >  ウェブフロントエンド  >  JQuery のさまざまなセレクターの紹介

JQuery のさまざまなセレクターの紹介

零下一度
零下一度オリジナル
2017-06-26 11:55:351275ブラウズ

1. JQuery基本セレクター

idセレクタークラスセレクタータグセレクターワイルドカードセレクターグループセレクター
express 説明 $("#idName")
$(" .className")
$("tagName")
$("*")
$( "tagName,.className, # ID名、 ...")
2. 階層セレクター

は親子関係と兄弟関係からノードを選択します。

expresssde scriptION
RMARKS $ ("A & GT ;b") を選択しますノード a (孫ノードではなく、子ノードのみを含みます)$("a+b")$("a~b ")ノード a の後のすべての兄弟ノード b を選択しますすべての兄弟ノードではなく、ノード a,

3. 基本的なフィルターセレクター

は、場所の観点からタグをフィルターします。名前:ファースト" )

tagName 要素セットの最初の要素を選択します
$ ("A B") ノード A のすべての子孫ノードを選択します (サブノードと Sun Jie ノードを含む)
のすべての子ノード b
ノード a の後の最初のノードを選択します 兄弟ノード b
の後の兄弟ノードであることに注意してください
(インデックスは配列と同じで、0 から始まります)$("tagName:gt(2)") tagName 要素セット 3 番目の要素を選択tagName 要素内で すべてのヘッダー要素を選択します アニメーション要素を選択$("tagName:not(.one)")
$("tagName:last") tagName 要素セットの最後の要素を選択します
$("tagName:odd ") tagName 要素セット内の奇数位置にある要素を選択します
$("tagName:even") tagName 要素セット内の偶数位置にある要素を選択します
$("tagName:eq (1 )") tagName 要素セットの 2 番目の要素を選択します
の 3 番目の要素以降の要素 (つまり、tagName の下の要素、位置が 3 より大きい)
$("tagName:lt(2)")
より前の要素 (つまり、tagName の下の位置が 3 より小さい要素) に設定します
$(":header")
( h1 から h6 )
$(" :animated")

クラス値がtagName要素の1ではない要素を選択set
4. コンテンツフィルタリングセレクター
ノード値が空かどうか、ノード上のテキストに指定された文字列が含まれているかどうか、および子要素のクラス値が指定されたクラス値であるかどうかvalue.
express

description

Remarks

$( "tagname:empty")

タグネーム要素コレクションの空のコンテンツを使用して要素を選択します(子要素ではありません)
$("tagName:has(.one)")tagNmae要素セット内のクラス値が1の要素を選択します
$("tagName:parent" ) tagName要素セット内の子要素を含む要素を選択します
$("tagName:contents('abc')") 「」を含む要素を選択しますtagName要素セット内のabc"(子要素ではありません)
(子要素ではありません)要素、それは tagName 要素です)

5. 属性フィルター (指定された属性を含む要素を選択)

属性に基づいてノードをフィルターします: 属性の有無、属性値が等しい、等しくない、含む、** で始まる、 * * end、複数のフィルタリング。

$ ("div[id='test']")
選択された要素には id="test" が含まれています そして id 属性を持っています6. 可視性フィルターセレクターは、ページ上の要素が表示されるかどうかに基づいてノードを選択します備考
$("div[title!='test']") 選択された要素 title 属性が「test」ではありません
$("div[title^='te']") 選択した要素の title 属性値が「test」で始まります
$("div[title$='st']") 選択した要素のtitle属性は"test"で終わります
$("div[title*='est']") 選択した要素の title 属性値に "est" が含まれています
$("div[title*='est'][id]") 選択した要素の title 属性値に "est" が含まれています、

特急
説明

$("div:hidden")

非表示のdiv要素を選択

$("div :hidden")
div要素内のすべての非表示要素を選択(子要素と要素を含む)孫要素)$("div:visiable")表示可能な div 要素を選択$("div :visiable") div 内の表示可能な要素を選択( 子要素と孫要素)

以上がJQuery のさまざまなセレクターの紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。