如何使用jQuery选择具有特定ID的所有元素？

Question

我想在jQuery中选择所有具有相同ID的<div>。如何实现？

我尝试过这个，但它没有起作用。

jQuery('#xx').each(function(ind,obj){
      //do stuff;
});

- mark

---

ID 应该是唯一的。请使用类(class)。 - Antony Carthy

大家都知道这个，但没有人在这里回答他的问题。 - Sid

并非总能拥有唯一的ID，至少我不能一直承担那个成本。好吧，@mydoghasworms已经相当好地回答了这个问题，简洁明了。 - Fr0zenFyr

Answer 1

虽然这里还有其他正确的答案（例如使用类），但从学术角度来看，拥有多个具有相同ID的div是完全可能的，并且可以使用jQuery选择它们。

当你使用

jQuery("#elemid") 

它仅选择具有给定ID的第一个元素。

然而，当您通过属性选择（例如，在您的情况下为id）时，它将返回所有匹配的元素，如下所示：

jQuery("[id=elemid]") 

当然，这对于任何属性的选择都适用，并且您可以通过指定相关标签（例如在您的情况下为div）来进一步细化您的选择。

jQuery("div[id=elemid]") 

- mydoghasworms

---

你是唯一一个回答所提出问题的人。 - wcm

至少有人知道如何在jQuery中做真正的事情了...天哪！我很想知道这个，其他的方法都不起作用。我简单地无法接受其他人使用类的方法，因为我已经在那里使用它来完成不同的工作。向@mydoghasworms致敬！ - Fr0zenFyr

这是正确答案，应该被接受，+1。 - Zach

优美简洁。谢谢。 - James Manes

我本来想说：这里有很多建议，但没有答案。幸运的是，你恰当地回答了我的问题，我认为即使@Ballsacian1建议的方法可以避免问题，这个答案也应该被接受。 - gigaDIE

我认为你需要在id值周围加上引号吗？jQuery("div[id='elemid']") - jessieloo

Answer 2

我会使用不同的ID，但为每个DIV分配相同的类。

<div id="c-1" class="countdown"></div>
<div id="c-2" class="countdown"></div>

这样做的另一个好处是可以根据jQuery('.countdown').length的返回值重构IDs。

---

好的，要怎么给每个倒计时器添加多个类呢？比如：

<div class="countdown c-1"></div>
<div class="countdown c-2"></div>
<div class="countdown c-1"></div>

这样你就可以兼顾两个世界的优点。它甚至允许重复的“IDS”。

- Ballsacian1

---

Ballasacian：我有n个计数器，它们的ID为1..n，因此对于每个i，我都有id=c-1，id=c-2等。但其中一些重复了。所以我不能使用你的方法。它们都具有相同的class='countdown'。谢谢。 - mark

为什么您想要重复呢？特别是在必须唯一的ID上。 - Ballsacian1

Ballasacian：谢谢！太棒了！像我想要的那样工作！！不知道为什么以前没有想到过！ - mark

重要的是要有一个完整的答案，假设前提条件而不是解决方法。即使您认为前提条件不是最佳选择，它们通常是一种给定的方式（例如编写针对使用此方式的现有网站的id标签的Greasemonkey脚本）。 - shiggity

这不应该被接受作为答案。有些情况下（例如Greasemonkey脚本），我们无法控制HTML，而且肯定有一些网站会多次使用相同的ID。 - blues

这不是答案，问题不是关于如何使用HTML，而是关于如何选择具有相同ID的多个元素。 - Le chat du rabbin

Answer 3

您的文档中不应包含两个具有相同ID的div。这是无效的HTML，因此底层DOM API不支持它。

根据HTML标准：

id = name [CS] 属性为元素分配名称。该名称在文档中必须唯一。

您可以为每个div分配不同的ID，并使用$('#id1, #id2)选择它们两个。或者将它们都分配相同的类（例如.cls），并使用$('.cls')来同时选择它们。

- Ayman Hourieh

---

还需要注意的是，大多数底层的getElementById()函数，包括jQuery和其他库最终调用的实际搜索函数，只会返回与给定ID匹配的第一个（或随机的？）元素，并且支持它意味着需要手动遍历DOM。对于无效的标记来说，这样做并不值得！ - ironfroggy

关于这篇文章： 有趣的是，有一个名为getElementsByName(xxx)的JavaScript函数 - 注意它的复数形式 - 意味着拥有多个具有相同名称的元素是完全合法的... - Jimbo

@Jimbo - 没错，但我的回答是关于拥有相同“id”的元素，而不是“name”。 - Ayman Hourieh

@Jimbo — 嗯，是的，单选按钮组取决于功能。但并非所有元素都可以有名称。问题提到了divs，它们没有name属性。 - Quentin

Answer 4

尝试通过首个id选择div，可以使用以下方法：

$('div[id^="c-"]')

- atabak

Answer 5

$("div[id^=" + controlid + "]")将返回所有具有相同名称的控件，但您需要确保文本不会出现在任何控件中。

意思是，这个代码可以查找所有名字相同的控件，但你需要确保文本不会出现在这些控件中。

- Niranjan Kumar

Answer 6

您能为每个不同的计时器分配一个唯一的CSS类吗？这样您就可以使用CSS类的选择器，这将与多个

元素很好地配合使用。

- Paul Morie

---

抱歉，我不能为每个计时器使用唯一的类，因为我使用该类来选择所有计时器，初始化和样式化倒计时计时器。 - mark

HTML类。人们几乎只使用类来匹配CSS选择器，这并不意味着它们是不同语言的一部分。 - Quentin

虽然class确实是HTML的一部分，但它是专门添加以支持CSS的（当时JS不存在，而且在HTML中class没有任何效果）。 - bfontaine

Answer 7

你也可以尝试将这两个div包装在带有唯一id的两个div中。然后通过$("#div1","#wraper1")和$("#div1","#wraper2")选择div。

就是这样：

<div id="wraper1">
<div id="div1">
</div>
<div id="wraper2">
<div id="div1">
</div>

- omer