选择具有相同ID的所有元素

Question

我知道元素id应该是唯一的，但是在需要时应该使用哪个选择器

$("*#x1")，$("[id=x1]")或其他什么？

HTML

<div id="x1">A</div>
<div id="x1">B</div>
<div id="x2">C</div>

http://jsfiddle.net/2VHBC/2/

Answer 1

正如其他几个答案所述：不重复ID 。这是一个可怕的，可怕的，没有好的，非常糟糕的主意：Can multiple different HTML elements have the same ID if they're different elements?

我不确定如果你这样做会发生什么，但我打赌它取决于浏览器，这意味着你不能依赖它是合理的。

改为使用class：

<div class="x1">A</div>
<div class="x1">B</div>
<div class="x2">C</div>

然后使用jQuery的类选择器，它匹配CSS语法：

$('.x1')

Answer 2

是的，您的html标记无效且ID在页面上必须是唯一的，但attribute选择器会在这种情况下完成您的工作。

alert($('[id=x1]').length);

Js Fiddle Demo

Answer 3

这样可行（是的，这是一个长镜头）。

$("[id]").each(function(){
 if($(this).attr("id")=="x1"){
  // do something
 }
});

ID必须是唯一的。如果您使用类而不是 ID ，则很容易将它们全部选中。 此外，由于您可以按属性选择多个元素，因此您可以使用$('[id=x1]')

Answer 4

由于可以访问ID，因为任何属性$('[id="x1"]')都可以实现。

演示：http://jsfiddle.net/VkaWN/

但如果可能影响设计的变化，那就是糟糕的结局。

Answer 5

您应该使用一个类来识别在这种情况下使用的错误ID。

console.log($('body #x1'));

Answer 6

只需为每个循环添加，以指定所有具有类 .one 的元素，它将自动将所有具有类 .one 的元素转换为 .blue < / strong>颜色。干杯! ：）

   let clonedEle = $(".one").clone();

    clonedEle.insertAfter(".one");

    $(".one").click(function() {
      $(".one").each(function(){
        $(this).css("background-color", "blue");
       });
    });

Answer 7

总是给我们不同的ID。只需在div上添加自定义属性，然后尝试如下操作：

<div data-id='x1' id='div1'></div>
<div data-id='x1' id='div2'></div>
<div data-id='x2' id='div3'></div>

var number = 6;
var myDiv = $('div[data-id='x1']');