JQueryで属性または属性値に基づいて要素を取得する(6つの取得方法)

JQueryで属性または属性値に基づいて要素を取得する(6つの取得方法)_jquery

WBOY

リリース： 2016-05-16 17:43:33

オリジナル

1212 人が閲覧しました

属性に基づいて要素を取得する

1 たとえば、ページの p タグ内の id 属性を持つ要素を取得する場合は、

 
$("p[id]").css("color","re​​d"); > 
属性値に従って要素を取得します

1.$。 jQuery では、$("") の構文は $(document.createElement("span")) と同等であり、要素を選択するときにも次のように使用されます。 value] は、指定された属性が何らかの値で終わる要素と一致します。例を挙げて説明します。
HTML コード

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

>jQuery コード:

コードをコピー

コードは次のとおりです: $("input[ name$='letter ']")

結果:
[ , ]

2 .!.セレクター: [attribute!=value]、指定された属性を含まないすべての要素に一致するか、属性が特定の値に等しくありません。このセレクターは not ([attr=value]) と同等です。
例:
HTML コード

コードをコピー

コードは次のとおりです: >

jQuery コード:

コードをコピー

コードは次のとおりです。 $("input[name!='newsletter']").attr("checked", true);

結果:

[ ]

3 .*。セレクター: [attribute*=value]、指定された属性を特定の値を含む要素に一致させます。例を見てみましょう:

HTML コード:

コードをコピー

コードは次のとおりです: =" newmilk" />

jQuery コード:

コードをコピー

コードは次のとおりです: $("input[name*='man']") 結果:

[ 、<入力名="ミルクマン" />、<入力名="レターマン2" /> ]

4.@。指定された属性を含む要素と一致します。 jQuery 1.3 では、先頭の @ 記号が非推奨になったことに注意してください。最新バージョンとの互換性を維持したい場合は、@ 記号 
 を削除してください。 

5.^.セレクター: [attribute^=value]、指定された属性が特定の値で始まる要素と一致します。以下に例を示します:
HTML コード:

コードをコピー

コードは次のとおりです。 <🎜 ; > jQuery コード:

コードをコピー

コードは次のとおりです:

$("input[name^='news']") 結果: [ gt;, ]

6 設定値に指定された属性と指定された文字列を持つ要素を取得します 
HTML コード: 

コードをコピー

コードは次のとおりです:

jQuery code:

Copy code The code is as follows:

 
$("input[name$='letter'][value$='zz']") .attr("checked","true"); supports multi-condition operations 

Of course, it can also be obtained based on the id attribute or other attributes, such as $("input[id=id1]" ).css("color",red);
In jquery, when using $("input[name='metaId']").val() you cannot directly get the value of the selected radio, you just get the radio The first value of the label, this may be related to jquery using the xpath language for search, and we usually want to get the value of the selected radio. There are the following methods:
1, use $(”input[name= 'metaId']:checked").val() to obtain //name represents the name attribute name in radio
2, use $(":radio:checked").val() to obtain //limit the page to only one set of radios Label