对具有 id LIKE 'abc%' 的 dom 执行操作答案

【问题标题】：Do action on dom having id LIKE 'abc%'对具有 id LIKE 'abc%' 的 dom 执行操作
【发布时间】：2013-10-16 16:11:43
【问题描述】：

我想对 ID 为 'abc%' 的 DOM 执行一些操作

<a id='abc1'></a>
<a id='abc2'></a>
<a id='abc3'></a>
<a id='abc4'></a>
<a id='1234'></a>

在上面的代码中，我必须对所有具有 id 的锚点执行操作，例如 'abc%'

使用jquery怎么做？

【问题讨论】：

使用类会更整洁。部分 ID 匹配很混乱。
ID 应该是唯一标识符。如果您想将它们组合在一起，使用不同的属性（例如class）会很有意义

标签： javascript php jquery dom

【解决方案1】：

你可以用这个：

$('a[id^="abc"]')

它被称为Attribute Starts With Selector。

在这里你可以看到它的工作：http://jsfiddle.net/suLsx/

【讨论】：

@Vinoth：我希望你能阅读剩下的话题，或者你是那些满足于“它有效”的人之一？
@MattiVirkkunen：是的，老兄！但首先是工作和休息！ :)

【解决方案2】：

正如Matti 正确指出的那样，为这些锚标签添加一个额外的类会更简洁，以便创建一个更容易使用的选择器：

<a class="the_link" id='abc1'></a>
<a class="the_link" id='abc2'></a>
<a class="the_link" id='abc3'></a>
<a class="the_link" id='abc4'></a>
<a id='1234'></a>

现在你可以这样做了：

$( "a.the_link" ); // this selector will now operate on all the desired elements
$( "a.the_link" ).hide(); // hide all the links
$( "a.the_link" ).fadeOut(); // fade out all the links

【讨论】：

嘘，我不认为最后一个元素应该有那个类。
这可能也比解析匹配的 id 所需的逻辑更快。
@mat - ooooopppsss！ :P 谢谢！（顺便说一句很棒的评论）
@ror - 如果有的话，我建议纯粹为了可读性和可维护性添加该类。
@Lix 向合唱团讲道，我的朋友 :D 不幸的是，我只有 1 个赞。

【解决方案3】：

试试看，

alert($( "a[id^='abc']" ).length);

阅读attribute start with selector

Working Fiddle

【讨论】：