Elemente mit ID-Attribut auswählen, das mit einem bestimmten Wert beginnt/endet

Question

Kann jQuery oder JavaScript mit einer Regex verwendet werden, um mehrere Elemente mit ähnlicher ID auszuwählen?

Ich habe die folgenden Absätze:

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

ich den Inhalt der Absätze mit der ID ab item und endend in 2 ändern möchten.

habe ich die folgende jQuery:

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

aber es funktioniert nicht. Wie kann ich es zur Arbeit bringen?

JSFiddle Demo

Answer 1

Ja, es kann, können Sie die attribute starts with kombinieren und den attribute ends with Selektor

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

FIDDLE(und Sie haben jQuery in der Geige ermöglichen)

Sie nicht regex verwenden können, obwohl die Zahlen übereinstimmen dazwischen, denn das würde Sie filter()

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

Answer 2

Sie können "mit Start" und "endet mit" Selektoren von jQuery zur Verfügung gestellt, wie unten.

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

Offizielle Dokumentation:

• Start with selector
• Ends with selector

Answer 3

Sie können brauchen Attributselektoren kombinieren: fiddle

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

Answer 4

Versuchen Sie, diese

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

und ...

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

Answer 5

Der beste Weg zu gehen the following jQuery selectors

^= is starts with 
$= is ends with 

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

Also in Ihrem Fall zu verwenden:

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

Answer 6

ist die JS FIDDLE

von HTML-Code:

<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')); 
    }); 
} 

Answer 7

Sie nächsten Code verwenden können, wenn Sie eine andere Aktion zu tun:

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

});