jquery - 如何使 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();
    }
});

我不确定 ID 是否在第一个之后被擦除，因为它们是重复的，但如果不是，这应该可以工作。

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 必须是唯一的

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

id和类选择器的区别

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

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