ホームページ > ウェブフロントエンド > jsチュートリアル > 一般的な jQuery selectors_jquery のまとめ

一般的な jQuery selectors_jquery のまとめ

WBOY
リリース: 2016-05-16 16:30:39
オリジナル
1241 人が閲覧しました

基本要素セレクター

コードをコピーします コードは次のとおりです:

$("p")
$("p.ii") は、class=ii
を持つすべての p 要素を選択します。 $("p#demo") は、id=demo
を持つ最初の p 要素を選択します

階層セレクター

コードをコピーします コードは次のとおりです:

$("div input")div
の下のすべての入力 $("div>input")

基本条件セレクター

コードをコピーします コードは次のとおりです:

$("p:first")
$("p:last")
$("tr:even") は偶数行を選択します
$("tr:odd")奇数
$("input:not(:checked)") は選択されたすべての要素を選択します
$("tr:eq(1)")インデックス値 1 のテーブル
$("tr:gt(0)") は 0 より大きいです
$("tr:lt(0)") は 0 未満です
$(":header") はすべてのヘッダー要素を選択します
$(":animated")実行中のアニメーション

コンテンツ条件セレクター

コードをコピーします コードは次のとおりです:

$("div:constains('ddd')") は、ddd テキストを含むレイヤー要素を選択します
$("td:empty") はテキストやサブ要素を含まない表のセルを選択します
$("div:has(p)") は段落要素
を含むレイヤー要素を選択します $("td:parent") は、子要素またはテキストを含む表のセルを選択します

可視条件セレクター

コードをコピーします コードは次のとおりです:

$("tr:hidden") //すべての非表示テーブルを選択します
$("tr:visible") はすべての表示可能なテーブルを選択します

属性セレクター

コードをコピーします コードは次のとおりです:

$("div[id]")id 属性を持つレイヤー
$("input[name='']") 入力属性名=''
$("input[name!='']")
$("input[name^='']") は、name 属性を持ち、値が '' であるフォーム入力要素を開始コンテンツとして選択します
$("input[name$='']") は、name 属性を持ち、値が '' であるフォーム入力要素を終了コンテンツとして選択します
$("input[name*='']") は、name 属性と値 ''
を持つフォーム入力要素を選択します $("input[id][name$='']") は、''
で終わる id 属性と name 属性の値を持つ入力フォーム要素を選択します。

子要素セレクター

コードをコピーします コードは次のとおりです:

$("ul li:nth-child(2)") は 2 番目のリスト項目を選択します
$("ul li:nth-child(even)")
$("ul li:nth-child(odd)")
$("ul li:nth-child(3n)")
$("ul li:first-child")
$("ul li:last-child")
$("ul li:only-child") 選択リストが表示され、リスト項目が 1 つだけ表示されます

フォーム要素セレクター

コードをコピーします コードは次のとおりです:

$("input") はすべての入力テキストエリア選択ボタンとその他の要素を選択します
$(":text")テキスト行
$(":パスワード")
$(":ラジオ")
$(":チェックボックス")
$(":送信")
$(":画像")
$(":リセット")
$(":ボタン")
$(":file")
$(":hidden")

フォーム属性セレクター

コードをコピーします コードは次のとおりです:

$("input:enabled") //利用可能なものをすべて選択
$("入力:無効")
$("入力:チェック済み")
$("選択:オプション:選択")
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート