web-dev-qa-db-ja.com

特定の値で開始/終了するid属性を持つ要素を選択します

JQueryまたはJavaScriptを正規表現で使用して、類似のIDを持つ複数の要素を選択できますか？

次の段落があります。

<p id="item5_2"> A </p>
<p id="item9_5"> B </p>
<p id="item14_2"> C </p>

itemで始まり2で終わるidを持つ段落の内容を変更したい。

次のjQueryを使用しました。

$("#item[\d]*2").html("D");

しかし、それは機能しません。どうすれば機能しますか？

JSFiddle Demo

javascriptjqueryhtmlregex
29
Alexandru Severin

はい、できます。 属性で始まる セレクタと 属性で終わる セレクタを組み合わせることができます

_$('[id^="item"][id$="2"]').html("D");
_

[〜＃〜] fiddle [〜＃〜]（フィドルでjQueryを有効にする必要があります）

ただし、間に正規表現を使用して数字を一致させることはできません。そのためには、 filter() が必要です。

_$('[id^="item"]').filter(function() {
    return this.id.match(/item\d+_2/);
}).html("D");
_
35
adeneo

「start with」および「ends with」セレクターを使用できます以下のようなjQueryを使用します。

$("[id^='item'][id$='2']").html("D");

公式文書：

15
Bhushan Kawadkar

最適な方法は、次のjQueryセレクターを使用することです

^= is starts with
$= is ends with

=  is exactly equal
!= is not equal
*= is contains

あなたの場合：

var $items = $('[id^="item"][id$="2"]');
9
martynas

これが動作です JS FIDDLE

HTML：

<p id="item5_2"> A </p>
<p id="item9_5"> B </p>
<p id="item14_2"> C </p>
<input type="button" value="Get element ids starting with 'item' and ending with '2'" onclick="get_ids()">

JS：

get_ids = function(){
    $('[id^="item"][id$="2"]').each(function() {
        alert($(this).attr('id'));
    });
}
4
Rahul Gupta

属性セレクターを組み合わせることができます： fiddle

$("[id^='item'][id$='2']").html("D");
4
Adrift

これを試して

 <p id="item5_2"> A </p>
 <p id="item9_5"> B </p>
 <p id="item14_2"> C </p>

そして...

 $('[id^="item"][id$="2"]')
4
Illaya

他のアクションを実行する場合は、次のコードを使用できます。

$('[id^="item"]').each(function(){
  if(this.id.slice(-1) == 2){
    //Do something
    $(this).html('D');
  }

});
2
Brotheryura