jQueryのSelectorに関する知識ポイントのまとめ

JQuery セレクターの概要。必要な友人はそれを参照してください。これらは一般的に使用される選択制御メソッドです。

//jQuery selector$
//$(expression,[context]) return jQuery
//ユニット 1
//expression の CSS 定義者は、CSS 構文を使用して選択される要素を表します

// $( "* "); // ページ上のすべての要素タグを表します
// $("th, td") // すべての 要素タグを表します
// $("a") //すべての<>要素タグを表します
// $("p#onlyp"); // CSS選択内のid=onlyidvを持つ要素$("#ID")が完全なドキュメント一致であることを示します
// $(" #rated"); // id=ratedlist を持つ要素を表します
// $("#ownedlist > li"); // id=ownedlist を持つすべてのサブ要素を表しますが、sub の下にあるサブ要素は含まれません-element
// $("#ownedlist li: last"); // id=ownedlist
の li の最後の要素を表します // $("#ownedlist li:first"); // li の最初の要素を表しますin id=ownedlist
// $("#ownedlist li :nth- child(0)"); // id=ownedlist の (N) 番目の要素 n が配列添字であることを示します
// $("button: Only-child"); //CSS 選択でそれが親コンテナの唯一の要素であることを示します
// $(".stuff:empty"); // CSS 選択で空の要素を表します
// $(" .buttons:enabled"); // CSS 選択内の通常の要素を表します 有効な要素
// $(".buttons:disabled"); // CSS 選択内の非有効な要素を表します
// $("input:checked "); // CSS 選択の選択された要素を表します
/ / $("button:not(.not)"); // CSS 選択の not() の要素の削除を表します
// $("button.not) "); // CSS 選択にない class= を表します 要素 $(".CLSS") はドキュメント全体と一致します
// $("#ownedlist2 li"); // id=ownedlist を持つすべてのサブ要素を示し、以下が含まれますすべてのサブ要素のサブ要素
// //alert($ ("#ownedlist ~ li").length);
// $("#ownedlist,.buttons,li"); // CSS に一致する要素selectors



//式は要素の属性に基づいて選択されます
/ /alert($("button[@class]").length); //クラス属性を持つ要素を示します
//alert($("button [@class=not").length); // クラス属性を持つ要素を示します not と等しい属性と値を持つ要素です
//alert($('button[@class^=not').length); //クラス属性と値が not で始まる要素を示します
//alert($('button [@class$=not').length) // クラス属性と値の末尾が not
と一致する要素を示します//alert($('button[@class*=not').length); // 値に一致しないクラス属性と要素があることを示します
//XPATH の式 フィルター XPATH 構文選択する必要があるページ要素
//$("ol[@id^='ownedlist']").find(" li:contains('First')").each(function(i) {
// // $(this).html( $(this).html() + " BAM! " + i );
// $(this).mouseover(function(){
// $(this).css( "色","赤");
// });
// $(this).mouseout(function(){
// $(this).css("color","#000");
// });
// });
//ol タグと属性 id=ownedlist を持つすべての要素を検索します。次の 2 つの書き方があります
//ol[@id='ownedlist'] 親要素を見つけるには各反復を直接使用します
//ol[@id='ownedlist']/* 親要素の下にあるすべての子要素については、 find('child-element' ).each() を使用します 反復します

//ユニット 2
// /$( html, [ownerDocument]) return jQuery
//この関数では html 要素 テキストを渡すことができ、コンストラクターは jQuery オブジェクトによって作成された HTML テキストを生成します。このオブジェクトは元々存在することはできません、または存在することもできます元のページで
//$('

hello

').appendTo("h2"); //マークアップ テキストを生成し、ページの h2 タグに追加することもできます
//元のページ要素を取り出して追加します
//$("input",this).appendTo("h2"); //ここで取り出したページ要素は移動されることに注意してください

///$ (要素) return jQuery
//この関数は DOM を直接渡すことができます
//$(document.forms[0].elements).appendTo("h2"); // DOM ドキュメントを参照できます
//$( callback) return jQuery



//以下はセレクターの手順です
/*
基本:

#id: id 属性に基づいてオブジェクトを取得します。
element: 特定の HTML タグに一致するすべてのオブジェクト
.class: クラス属性に基づいてオブジェクトを取得する
*: すべてのオブジェクトを取得する
selector1、selector2、selectorN: 重複を削除せずに複数のセレクターのコレクションを取得する 項目

レベルセレクター:
ancestor子孫: このセレクターはスペースです。これは、まず最初のセレクターのすべてのオブジェクトを検索し、次にその子孫ノード内の 2 番目のセレクターに一致するすべてのオブジェクトを検索することを意味します。
親 > 子: このセレクターは大なり記号であり、最初に最初のセレクターのすべてのオブジェクトを検索し、次にその子ノード (孫ではない) で 2 番目のセレクターに一致するすべてのオブジェクトを検索することを意味します。
prev + next: このセレクターはプラス記号です。これは、まず最初のセレクターのすべてのオブジェクトを検索し、次に 2 番目のセレクターにも一致する同じレベルにある次のノードのオブジェクトを検索することを意味します。
prev ~ 兄弟: このセレクターは ~ 記号です。これは、まず最初のセレクターのすべてのオブジェクトを検索し、次に同じレベルの後続のすべてのノードで 2 番目のセレクターに一致するオブジェクトを検索することを意味します。

基本的なフィルター文字:
:first: 複数のオブジェクトの最初のオブジェクトと一致する
:last: 複数のオブジェクトの最後のオブジェクトと一致する
:not(selector): not 項目の後のセレクター内のコンテンツと一致する
:even:すべてのオブジェクトの偶数
:odd: すべてのオブジェクトの奇数と一致
:eq(index): 以下の特定のテーブルの 1 つの要素と一致
:gt(index): 特定の要素よりも大きい 添字付きのすべての要素と一致
:lt(index): 特定の添え字未満のすべての要素と一致します
:header: h1、h2、h3、h4、h5、h6 などのすべてのヘッダー要素と一致します
:animated: アニメーション効果のあるすべての要素と一致します 要素

テキストフィルター:
:contains(text): 間接的に役立つ状況を含め、テキスト要素を内部に含むオブジェクトと一致します
:empty: 子要素のないすべてのオブジェクトと一致します
:has(selector): 少なくとも An オブジェクトを含むすべてのオブジェクトと一致します子セレクター
:parent: テキストのみを含むオブジェクトを含むすべての親オブジェクトと一致します

可視性フィルター:
:hidden: すべての非表示オブジェクト、または入力の非表示タイプと一致します
:visible : すべての表示オブジェクトと一致します

属性フィルター:
[attribute]: 特定の属性を持つすべてのオブジェクトと一致します
[attribute=value]: 特定の属性と値を持つオブジェクトと一致します
[attribute!=value]: 特定の属性を持つが特定の値ではないオブジェクトと一致します
[attribute^=value]: 特定の属性を持ち、特定の値で始まるオブジェクトと一致します
[attribute$=value]: 特定の属性を持ち、特定の値で始まるオブジェクトと一致します 特定の値で終わるオブジェクト
[属性*=値]: 特定の属性を持ち、特定の値を含むオブジェクトと一致します
[selector1] [selector2][selectorN]: 複数の属性セレクターに同時に一致するオブジェクトと一致します

子フィルター:
:nth-child (index/even/odd/equation): 子要素内の特定の添え字/偶数/奇数/方程式オブジェクトに一致します。:eq(index) は単一オブジェクトの子要素の特性にのみ一致し、このメソッドは一致します。複数のオブジェクトの特定のサブ要素の共通の特性
:first-child: 最初の子要素と一致します
:last-child: 最後の子要素と一致します
これら 2 つの一致する文字も、すべてのオブジェクトに対して実行できます複数の親オブジェクトの子要素
:only-child: 親要素に子要素が 1 つしかない場合、この子要素と一致します

フォーム フィルター文字
名前の種類

:input 戻り値: Arrayフォーム内の入力要素

:text 戻り値: Array

:password 内の入力タイプのテキストと一致する要素 戻り値: Array 入力タイプの要素と一致するフォームのパスワードです
​​
:radio 戻り値: Array

:checkbox の入力タイプが radio である要素と一致します 戻り値: Array
フォームの要素と一致します入力タイプがチェックボックス

:submit 戻り値: Array
入力タイプがフォーム内の submit 要素と一致する

:image 戻り値: Array
フォーム内の画像と一致する要素

:reset 戻り値: Array
入力タイプがリセットされたフォーム内の要素に一致

:button 戻り値: Array
入力タイプがリセットされたフォーム内の要素に一致ボタン

:file 戻り値: Array 入力タイプが file であるフォーム内の要素に一致します

:hidden 戻り値: Array 入力タイプにあるフォーム内の要素に一致します。非表示または非表示の領域です



:enabled 戻り値: Array
すべての有効な要素と一致します

:disabled 戻り値: Array
すべての非有効な要素と一致します

:チェック済み 戻り値: Array
選択されたすべての要素と一致する

:selected 戻り値: Array
選択されたすべての要素と一致する
ドロップダウン リスト

*/

以上がjQueryのSelectorに関する知識ポイントのまとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。