选择具有以特定值开头/结尾的id属性的元素

Ale*_*rin 29 html javascript regex jquery

jQuery或JavaScript可以与正则表达式一起使用来选择具有相似id的多个元素吗?

我有以下段落:

<p id="item5_2"> A </p>
<p id="item9_5"> B </p>
<p id="item14_2"> C </p>
Run Code Online (Sandbox Code Playgroud)

我想更改id开头item和结尾的段落内容2.

我使用了以下jQuery:

$("#item[\d]*2").html("D");
Run Code Online (Sandbox Code Playgroud)

但它不起作用.我怎样才能让它发挥作用?

JSFiddle演示

ade*_*neo 35

是的,你可以将属性开头属性以选择器结束

$('[id^="item"][id$="2"]').html("D");
Run Code Online (Sandbox Code Playgroud)

FIDDLE (你必须在小提琴中启用jQuery)

你不能使用正则表达式匹配两者之间的数字,因为你需要 filter()

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

  • 对于这个问题,这是一个很好的答案,但我想谈谈房间里的大象.__选择基于部分id匹配___是一种__horrible__方法,完全无视[分离关注](http://en.wikipedia.org/wiki/Separation_of_concerns).特别是当您可以使用数组来获得相同的结果时.不要将业务逻辑放在应用程序的表示层中.进行这些选择是开发人员的常见错误,他们在编写UI时迈出了第一步,最好避免使用. (2认同)

Bhu*_*kar 15

您可以使用jQuery提供的" start with "和" ends with "选择器,如下所示.

$("[id^='item'][id$='2']").html("D");
Run Code Online (Sandbox Code Playgroud)

官方文件:


mar*_*nas 9

最好的方法是使用以下jQuery选择器

^= is starts with
$= is ends with

=  is exactly equal
!= is not equal
*= is contains
Run Code Online (Sandbox Code Playgroud)

所以在你的情况下:

var $items = $('[id^="item"][id$="2"]');
Run Code Online (Sandbox Code Playgroud)