jQueryセレクターのワイルドカード[id * = 'id']とjqueryセレクターの概要

Wildcard

セレクタ

（1）ワイルドカード：

1. $('input[id$='code']')//id attribute all input tags ending with code

2. $('input[id*='code']')//id attribute contains all the input tags of code

   
   
   

3. $('input[name^='code']')//name attribute all input tags starting with code

4. $('input[name$='code']')//name attribute all input tags ending with code

5. $('input[name*='code']')//name attribute contains all the input tags of code

   
   
   

6. $('input[name*='code']').each(fuction(){

7. varsum=0

8. if($(this).val()!=''){

9. sum=parseInt(sum)+parseInt($(this).val())

10. }

11. $('#').text(sum)

12. })

13. $('tbody tr:even') //Select all tr ​​tags with an even index

（2）インデックスの選択による

1. jqueryObj.children('input').length

2. $('.main > a')

（3）jqueryObjの次のレベルのノードの入力数を取得します

（4）クラスがメインであるラベルの子ノードの下にあるすべてのラベルを取得します

（5）ラベルの横を選択します

2.フィルター

1. jqueryObj.keyup(function(event){

2. varkeyCode = event.which//Get the key value of the currently pressed keyboard, the Enter key is 13

3.イベント

1. $('#someField').val($.trim($('#someField').val()))//Remove spaces, syntax: $.trim(value)

2. $(”input[@ name =S_03_22]“).parent().prev().text()

3. $(”input[@ name ^=

4. 'S_'

4.ツール機能

Ps：jQueryセレクターの概要

jQueryのセレクターは強力です。一般的な要素ルックアップメソッドの概要を以下に示します。

$（ '＃myELement'）は、myElementと等しいID値を持つ要素を選択します。 id値を繰り返すことはできません。ドキュメント内の1つのid値のみがmyElementになることができるため、唯一の要素が取得されます。

$（ 'div'）は、すべてのdivタグ要素を選択し、div要素の配列を返します

$（ '。myClass'）は、myClassクラスを使用してcssのすべての要素を選択します

$（ '*'）はドキュメント内のすべての要素を選択し、共同選択にさまざまな選択方法を使用できます。たとえば、$（ '＃myELement、div、.myclass'）

カスケードセレクター：

$（ 'form input'）は、フォーム要素内のすべての入力要素を選択します
$（ '＃main> *'）id値がmainであるすべての子要素を選択します
$（ 'label + input'）は、すべてのラベル要素の次の入力要素ノードを選択します。テストセレクターは、入力タグ付きのラベルタグの直後にあるすべての入力ラベル要素を返します。
$（ '＃prev〜div'）兄弟セレクター。IDがprevのlabel要素の同じ親要素に属するすべてのdivタグを返します。

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

$（ 'tr：first'）は、すべてのtr要素の最初のものを選択します
$（ 'tr：last'）は、すべてのtr要素の最後を選択します
$（ 'input：not（：checked）+ span'）

フィルターアウト：チェックされたセレクターのすべての入力要素

$（ 'tr：even'）は、すべてのtr要素の0、2、4 ...要素を選択します（注：複数の要素が配列として選択されているため、シーケンス番号は0から始まります）
$（ 'tr：odd'）は、すべてのtr要素の1番目、3番目、5番目...の要素を選択します
$（ 'td：eq（2）'）すべてのtd要素でシーケンス番号2のtd要素を選択します
$（ 'td：gt（4）'）td要素でシーケンス番号が4より大きいすべてのtd要素を選択します
$（ 'td：ll（4）'）td要素でシーケンス番号が4未満のすべてのtd要素を選択します
$（ '：header'）
$（ 'div：animated'）

コンテンツフィルタリングセレクター：

$（ 'div：contains（' John '）'）は、Johnテキストを含むdiv内のすべての要素を選択します
$（ 'td：empty'）は、すべての空のtd要素（テキストノードを含まない）の配列を選択します
$（ 'div：has（p）'）pタグを持つすべてのdiv要素を選択します
$（ 'td：parent'）は、tdを親ノードとする要素のすべての配列を選択します

ビジュアルフィルターセレクター：

$（ 'div：hidden'）非表示になっているすべてのdiv要素を選択します
$（ 'div：visible'）すべてのビジュアルdiv要素を選択します

属性フィルターセレクター：

$（ 'div [id]'）は、id属性を持つすべてのdiv要素を選択します
$（ 'input [name =' newsletter ']'）name属性が 'newsletter'と等しいすべての入力要素を選択します
$（ 'input [name！=' newsletter ']'）name属性が 'newsletter'と等しくないすべての入力要素を選択します
$（ 'input [name ^ =' news ']'）name属性が 'news'で始まるすべての入力要素を選択します
$（ 'input [name $ =' news ']'）name属性が 'news'で終わるすべての入力要素を選択します
$（ 'input [name * =' man ']'）name属性に 'news'が含まれるすべての入力要素を選択します
$（ 'input [id] [name $ =' man ']'）ジョイント選択には複数の属性を使用できます。セレクターはすべてのID属性を取得し、属性はmanの最後の要素です。

子要素フィルターセレクター：

$（ 'ul li：nth-​​child（2）'）、$（ 'ul li：nth-​​child（odd）'）、$（ 'ul li：nth-​​child（3n + 1）'）
$（ 'div span：first-child'）は、すべてのdiv要素の最初の子の配列を返します
$（ 'div span：last-child'）は、すべてのdiv要素の最後のノードの配列を返します
$（ 'div button：only-child'）は、子ノードが1つしかないすべてのdiv内のすべての子ノードの配列を返します

フォーム要素セレクター：

$（ '：input'）は、input、textarea、select、buttonを含むすべてのフォーム入力要素を選択します

$（ '：text'）は、すべてのテキスト入力要素を選択します
$（ '：password'）すべてのパスワード入力要素を選択します
$（ '：radio'）すべてのラジオ入力要素を選択します
$（ '：checkbox'）すべてのチェックボックス入力要素を選択します
$（ '：submit'）すべての送信入力要素を選択します
$（ '：image'）すべての画像入力要素を選択します
$（ '：reset'）すべてのリセット入力要素を選択します
$（ '：button'）すべてのボタン入力要素を選択します
$（ '：file'）すべてのファイル入力要素を選択します
$（ '：hidden'）入力要素のすべての非表示フィールドまたは非表示の形式を選択します

フォーム要素フィルターセレクター：

$（ '：enabled'）は、実行可能なすべてのフォーム要素を選択します
$（ '：disabled'）操作できないすべてのフォーム要素を選択します
$（ '：checked'）すべてのチェック済みフォーム要素を選択
$（ 'select option：selected'）は、選択された子要素の選択されたすべての要素を選択します

名前が「S_03_22」である入力テキストボックスの前のtdのテキスト値を選択します

？

名前は「S_」で始まり、「_ R」で終わらない

？

radio_01という名前の無線によって選択された値

？

$（ 'A B'）は、間接の子を含む、A要素の下のすべての子ノードを検索します
$（ 'A> B'）A要素のすぐ下の子を検索します
$（ 'A + B'）間接の子を含む、A要素の背後にある兄弟を検索します
$（ 'A〜B'）間接の子を除いて、A要素の背後にある兄弟を検索します

1. $（ 'A B'）は、間接の子を含む、A要素の下のすべての子ノードを検索します

例：フォーム内のすべての入力要素を検索します

HTMLコード：

？

jQueryコード：

？

結果：

？

2. $（ 'A> B'）は、A要素のすぐ下の子を検索します

例：フォーム内のすべての子入力要素を照合します。

HTMLコード：

？

jQueryコード：

？

結果：

？

3. $（ 'A + B'）は、間接的な子を含む、A要素の背後にある兄弟を検索します

例：ラベルに続くすべての入力要素に一致する

HTMLコード：

？

jQueryコード：

？

結果：

？

4. $（ 'A〜B'）は、間接的な子を除いて、A要素の背後にある兄弟を見つけます

例：フォームのピアであるすべての入力要素を検索します

HTMLコード：

？

jQueryコード：

？

結果：

？

|_+_|

|_+_|

1.基本セレクターの基本

2.階層セレクター階層

3.基本フィルター基本フィルター

4.コンテンツフィルターコンテンツフィルター

5.可視性フィルター可視性フィルター

6.属性フィルター属性フィルター

7.子要素フィルター子フィルター

8.フォームセレクターフォーム

9.フォームフィルターフォームフィルター

http://bbs.chinaandroid.com/showtopic-89.aspxのjQuery（v1.3.2）に基づいています。

1）。基本

・#id指定されたIDに基づいて要素に一致します。例：$（ '＃id'）
・elementは、指定された要素名に基づいてすべての要素に一致します。例：$（ 'div'）
・.classは、指定されたクラスに従って要素を照合します。例：$（ '。style1'）
・*すべての要素に一致します。例：$（ '*'）
・selector1、selector2、selectorN各セレクターが一致する要素を組み合わせて、一緒に返します。例：$（ '＃id、div、.style1'）

2）。形

・：buttonはすべてのボタンに一致します。例：$（ '：button'）
・：checkboxはすべてのチェックボックスに一致します。例：$（ '：checkbox'）
・：fileはすべてのファイルドメインに一致します。例：$（ '：file'）
・：hiddenは、すべての非表示要素、または非表示タイプの要素に一致します。例：$（ 'input：hidden'）
・：imageはすべての画像フィールドに一致します。例：$（ '：image'）
・：inputは、すべてのinput、textarea、select、およびbutton要素に一致します。例：$（ '：input'）
・：passwordはすべてのパスワードボックスに一致します。例：$（ '：password'）
・：radioはすべてのラジオボタンに一致します。例：$（ '：radio'）
・：resetはすべてのリセットボタンに一致します。例：$（ '：reset'）
・：submitはすべての送信ボタンに一致します。例：$（ '：submit'）
・：textは、すべての1行のテキストボックスに一致します。例：$（ '：text'）
・：ヘッダーは、h1、h2、h3などのタイトル要素と一致します。例：$（ '：header'）。css（ 'background'、 '＃EEE'）

2.フィルタリング条件

1）。属性フィルタリング

・[attribute * = value]特定の属性に一致するのは、特定の値を含む要素です。例：$（ 'input [name * =' man ''）
・[attribute！= value]は、指定された属性を持つが、属性が特定の値と等しくないすべての要素に一致します。例：$（input [name！= 'man'）
・[attribute $ = value]指定された属性をある値で終わる要素と一致させます。例：$（ 'input [name $ =' man ']'）
・[attribute = value]指定された属性を特定の値の要素に一致させます。例：$（ 'input [name =' man ']'）
・[属性]は、特定の属性を含む要素と一致します。例：$（ 'div [id]'）
・[attribute ^ = value]は、ある値で始まる特定の属性を持つ要素と一致します。例：$（ 'input [name ^ =' man ']'）
・[selector1] [selector2] [selectorN]は同時に複数の条件を満たす。例：$（ 'input [id] [name $ =' man ']'）
・：hiddenはすべての非表示要素に一致します。例：$（ 'tr：hidden'）
・：visibleは、表示されているすべての要素に一致します。例：$（ 'tr：visible'）
・：checkedは、選択されたすべての選択された要素（チェックボックス、ラジオボタンなど、selectのオプションを除く）に一致します。例：$（ 'input：checked'）
・：disabledは、使用できないすべての要素に一致します。例：$（ 'input：disabled'）
・：enabledは、使用可能なすべての要素に一致します。例：$（ 'input：enabled'）
・：selectedは、選択されたすべてのオプション要素に一致します。例：$（ 'select option：selected'）

2）。コンテンツフィルタリング

・：contains（text）は、指定されたテキストを含む要素と一致します。例：$（ 'div：contains（' John '）'）
・：emptyは、子要素またはテキストを含まないすべての空の要素に一致します。例：$（ 'td：empty'）
・：has（selector）セレクターが一致する要素を含む要素と一致します。例：$（ 'div：has（p）'）
・：parentは、子要素またはテキストを含む要素と一致します。例：$（ 'td：parent'）

3）。階層的スクリーニング

・祖先の子孫指定された祖先要素の下にあるすべての子孫要素に一致します。例：$（ 'フォーム入力'）
・parent> childは、指定された親要素の下にあるすべての子要素と一致します。例：$（ 'form> input'）
・prev + nextは、prev要素の直後のすべての次の要素に一致します。例：$（ 'label + input'）
・prev〜siblingsは、prev要素の後のすべての兄弟要素と一致します。例：$（ 'form〜input'）
・：first-childは最初の子要素と一致します。例：$（ 'ul li：first-child'）
・：last-childは最後の子要素と一致します。例：$（ 'ul li：last-child'）
・：nth-​​child（index / even / odd /式）は、親要素の下のN番目の子またはパリティ要素と一致します。例：$（ 'ul li：nth-​​child（2）'）
・：only-child要素が親要素の唯一の子要素である場合、それは照合されます。例：$（ 'ul li：only-child'）

4）。メソッドスクリーニング

・：animatedは、アニメーション効果を実行しているすべての要素に一致します。例：$（ 'div：animated'）
・：eq（index）指定されたインデックス値を持つ要素を照合します。例：$（ 'tr：eq（1）'）
・：even0から始まるインデックス値が偶数であるすべての要素に一致します。例：$（ 'tr：even'）
・：firstは、最初に見つかった要素と一致します。例：$（ 'tr：first'）
・：gt（index）は、0から数えて、指定されたインデックス値より大きいすべての要素に一致します。例：$（ 'tr：gt（0）'）
・：lastは、最後に見つかった要素と一致します。例：$（ 'tr：last'）
・：lt（index）は、指定されたインデックス値よりも小さいすべての要素に一致します。例：$（ 'tr：lt（2）'）
・：not（selector）指定されたセレクターに一致するすべての要素を削除します。例：$（ 'input：not（：checked）'）
・：oddは、インデックス値が0から始まる奇数のすべての要素に一致します。例：$（ 'tr：odd'）

jQueryは、選択によって選択されたテキストと値を取得します。構文の説明：

1. $（ '＃select_id'）。change（function（）{// code ...}）// Selectのイベントを追加し、そのうちの1つが選択されたときにトリガーします

2. var checkText = $（ '＃select_id'）。find（ 'option：selected'）。text（）//選択によって選択されたテキストを取得します

3. var checkValue = $（ '＃select_id'）。val（）// Selectで選択された値を取得します

4. var checkIndex = $（ '＃select_id'）。get（0）.selectedIndex // Selectによって選択されたインデックス値を取得します

5. var maxIndex = $（ '＃select_id option：last'）。attr（ 'index'）// Selectの最大インデックス値を取得します

jQueryは、選択によって選択されたテキストと値を設定します。構文の説明：

1. $（ '＃select_id'）。get（0）.selectedIndex = 1 //選択インデックス値1でアイテムを設定します

2. $（ '＃select_id'）。val（4）// Selectの値を4の値に設定します

3. $（ '＃select_id option [text =' jQuery ']'）。attr（ 'selected'、true）//選択したテキスト値を選択したjQueryアイテムに設定します

jQueryは、SelectのOption項目を追加/削除します。構文の説明：

1. $（ '＃select_id'）。append（ 'Text'）//選択するオプション（ドロップダウン）を追加します

2. $（ '＃select_id'）。prepend（ 'Please select'）// Selectのオプション（最初の位置）を挿入します

3. $（ '＃select_id option：last'）。remove（）// Select（最後のインデックス）の最大インデックス値を削除します

4. $（ '＃select_id option [index =' 0 ']'）。remove（）// Select（最初の1つ）でインデックス値が0のオプションを削除します

5. $（ '＃select_id option [value =' 3 ']'）。remove（）// SelectのValue = '3'のオプションを削除します

6. $（ '＃select_id option [text =' 4 ']'）。remove（）// SelectのText = '4'のオプションを削除します

//オプションをトラバースして、オプションを追加、削除します

関数changeShipMethod（shipping）{

var len = $（ 'select [@ name = ISHIPTYPE] option'）。length

if（shipping.value！= 'CA'）{

$（ 'select [@ name = ISHIPTYPE] option'）。each（function（）{

if（$（this）.val（）== 111）{

$（this）.remove（）

}

}）

} そうしないと {

www.2cto.com $（ 'UPS Ground'）。appendTo（$（ 'select [@ name = ISHIPTYPE]'））}

}

//選択のセットをトラバースし、選択した値を設定します

$（ 'div：first select'）。each（function（）{

$（ 'div：first select option [value =' 0 ']'）。attr（ 'selected'、true）

}）

//ドロップダウンメニューの選択された値を取得します

$（＃testSelect option：selected '）。text（）

または$（ '＃testSelect'）。find（ 'option：selected'）。text（）

または$（ '＃testSelect'）。val（）

元の住所： http://www.jb51.net/article/76917.htm