如何使jQuery与包含​​重复ID的无效HTML一起使用？

Question

我有一个包含重复ID的HTML的旧项目。将选择器从id切换到类需要做很多工作，我可以用JQuery来做，特别是我知道我会隐藏多少个div。

<div id="d"></div>
<div id="d"></div>
<div id="d"></div>

我想用一个动作隐藏它们：

$('#d').hide(); 

但它只隐藏了第一个div。

Answer 1

ID应该是唯一的。尝试设置一个类，然后基于该隐藏。

<div class="d"></div>
<div class="d"></div>
<div class="d"></div>

$('.d').hide();

Answer 2

您隐藏了ID，因为您拥有非唯一ID，因此无效。将data- *属性添加到它们或将类添加为标志。

<div data-someattributename="flag" id="d">

$('div[data-someattributename]').hide();

由于您的修改：

$.each($('div'), function() {
    If ($(this).attr('id')=="d") {
        $(this).hide();
    }
});

我不确定ids是否在第一个之后被擦除，因为它们是重复的，但是如果它们不重复，那么这应该有效。

Answer 3

使用class而不是id属性，因为id必须对每个元素都是唯一的：

    <div class="d"></div>
    <div class="d"></div>
    <div class="d"></div>

然后：

   $(document).ready(function(){
            $(".d").hide();
   });

Answer 4

你可以通过父类或像

这样的div来做到这一点

(".parent_class/id>div").hide();

或

通过添加班级布兰登告诉

最重要的是id Mus是独一无二的

每个ID属性必须在文档上具有唯一值。

id和类选择器之间的区别

唯一真正的区别在于何时应该使用它们。 ID选择器通常保留用于在页面上出现一次的内容。例如，如果您有一个包含多个主题标题的页面，但是您希望从其他主题标题中脱颖而出，那么您将为该特定主题标题创建ID选择器规则。 ID选择器为其提供唯一的名称和标识，因此您可以更改该主题标题，而不会影响该组的其余部分。

如果您将验证多次使用相同ID的页面，则会出现错误