Javascript 具有相同ID的jQuery子元素

假设我有这个HTML结构：

    <div id="bodyRead">
          ...
            <div id="List"></div>
    </div>

   ...

    <div id="bodyWrite">
          ...
            <div id="List"></div>
    </div>

工作。我总是只在子div上创建重复的id，在jQuery选择器上我可以通过它们的父div将它们分开

---

这种做法是否非常错误？我的意思是，这会给我带来麻烦吗？

即使在子元素中也不要复制您的Id。。将其更改为class=“List” 然后你可以用

$('.List').on('click',function(){
    var getparent = $(this).parent().attr('id');
    alert(getparent);
});

如果class=“List”不是任何#bodyRead或#bodyWrite的第一级子级

添加类

 <div id="bodyRead" class="mainDiv">
 <div id="bodyWrite" class="mainDiv">

---

即使在子元素中也不要复制您的Id。。将其更改为class=“List” 然后你可以用

$('.List').on('click',function(){
    var getparent = $(this).parent().attr('id');
    alert(getparent);
});

如果class=“List”不是任何#bodyRead或#bodyWrite的第一级子级

添加类

 <div id="bodyRead" class="mainDiv">
 <div id="bodyWrite" class="mainDiv">

---

虽然id选择器是唯一的，但只要确保使用正确的嵌套，代码就可以工作。换句话说，

#bodyRead#List

和

#bodyWrite#List

都很好，只要您不通过省略

#List

的父选择器而造成歧义

---

不过，在同一页上使用多个相同的ID只是自找麻烦。您应该重新考虑切换到类选择器，或者重新评估是否真的值得花时间坚持您的原始想法。

虽然id选择器是唯一的，但只要确保使用正确的嵌套，您的代码就可以工作。换句话说，

#bodyRead#List

和

#bodyWrite#List

都很好，只要您不通过省略

#List

的父选择器而造成歧义

---

不过，在同一页上使用多个相同的ID只是自找麻烦。您应该重新考虑切换到类选择器，或者重新评估是否真的值得花时间坚持您的原始想法。

您应该期望CSS和JavaScript（包括jQuery和其他框架）的行为符合HTML规范。ID必须唯一，不支持同一ID的多个实例。见下文：

从HTML 4.01规范：

id=name[CS]此属性为元素指定名称此名称 在文档中必须是唯一的。

class=cdata列表[CS]此属性 为元素指定一个类名或一组类名。任何数字 元素的个数可以指定相同的类名。倍数 类名必须用空格字符分隔

这来自HTML 5规范：

3.2.5.1 id属性

id属性指定其元素的唯一标识符（id）。[DOM]

该值在元素的主ID中必须是唯一的 子树，并且必须至少包含一个字符。该值不能为空 包含任何空格字符

对于身份证的形式没有其他限制；在里面 特别是，ID可以仅由数字组成，以数字开头，以数字开头 带下划线，仅由标点符号等组成

元素的唯一标识符可用于多种用途， 最值得注意的是，使用 片段标识符，作为脚本编写时以元素为目标的一种方法， 作为从CSS中设计特定元素的一种方式

标识符是不透明的字符串。特定含义不应被忽略 从id属性的值派生

---

您应该期望CSS和JavaScript（包括jQuery和其他框架）的行为符合HTML规范。ID必须唯一，不支持同一ID的多个实例。见下文：

从HTML 4.01规范：

id=name[CS]此属性为元素指定名称此名称 在文档中必须是唯一的。

class=cdata列表[CS]此属性 为元素指定一个类名或一组类名。任何数字 元素的个数可以指定相同的类名。倍数 类名必须用空格字符分隔

这来自HTML 5规范：

3.2.5.1 id属性

id属性指定其元素的唯一标识符（id）。[DOM]

该值在元素的主ID中必须是唯一的 子树，并且必须至少包含一个字符。该值不能为空 包含任何空格字符

对于身份证的形式没有其他限制；在里面 特别是，ID可以仅由数字组成，以数字开头，以数字开头 带下划线，仅由标点符号等组成

元素的唯一标识符可用于多种用途， 最值得注意的是，使用 片段标识符，作为脚本编写时以元素为目标的一种方法， 作为从CSS中设计特定元素的一种方式

标识符是不透明的字符串。特定含义不应被忽略 从id属性的值派生

---

<>我觉得这是一个不好的方法，因为浏览器为页面创建DOM（文档对象模型），它考虑到每个ID都有一个唯一的值。当你想操纵时，很难用JavaScript中的重复ID来播放，每次都需要考虑父和子ID。因此最好使用类。

我觉得这是一种不好的方法，因为浏览器为页面创建了DOM（文档对象模型），考虑到每一个ID都有一个唯一的值，当你想操纵时，很难用JavaScript中的重复ID来播放，每次都需要考虑父和子ID。因此最好改用类。

您当然不应该在html页面中使用重复的id。如果您在两个不同的div中有一个类似的概念，那么类还是更有意义的。因此，将

列表

ID更改为class，然后您就可以访问

$('#bodyRead .List').off('click').on('click', function() ...
$('#bodyWrite .List').off('click').on('click', function() ...