在两个div元素中具有相同id的两个元素与其他id：updated是否正常是正常的

Question

我知道，这两个元素不能拥有相同的id。但事实是这样，在我的项目中，我有两个在其他div中具有相同id的元素，比如这个

<div id="div1">
     <img id="loading" />
</div>
<div id="div2">
     <img id="loading" />
</div>

和css：

#div1 #loading
{
    some style here...
}
#div2 #loading
{
    another style here...
}

对我来说很好，但也许这样做不被推荐吗？

由于

更新

是的，我知道，我可以使用课程，并且强烈建议这样做，但我想知道这种使用id有任何潜在的风险吗？ 我想不，因为我写的时候是

$("#div1 #loading")...它成为一个独特的元素。 不是吗？

最终更新

如果您有理由这样做，请使用建议的原则！ ;）

Answer 1

将您的ID更改为班级。给出重复的id并不是一个好主意。

想想两个同班同学的学生。想象一下他们得到的考试成绩。学校将如何识别该标记？

您的方式不是跨浏览器兼容，并且会在编写JavaScript，发布表单等方面影响很多

使用类

可以获得相同的效果

见

<div id="div1">
     <img class="loading" />
</div>
<div id="div2">
     <img class="loading" />
</div>

和css：

#div1 .loading
{
    some style here...
}
#div2 .loading
{
    another style here...
}

Answer 2

id必须（应该）才是唯一!!

在大多数浏览器中，通过JS选择它会有麻烦 - 更好地使用类

Answer 3

最重要的原因是JavaScript DOM操作。在你的情况下，如果你做这样的事情......

document.getElementById("loading")

... JavaScript将返回第一个元素，仅返回第一个元素。如果没有严重的DOM行走，你将无法访问其余部分。

Answer 4

仅仅因为没有其他人发布过它 - the HTML spec, section on ID，其中说：

  

id = name [CS]

     

此属性指定   元素的名称。这个名字必须   在文档中是独一无二的。

Answer 5

ID应该是唯一的，因此id1和id2很好，但是对于许多具有相同样式的元素，请使用HTML类和CSS类选择器：

.loading
{
styles here
}

允许在页面上重复这些次数：）

Answer 6

是的，你是对的，不建议这么做。 ID应始终是唯一的（例如，如果要使用javascript选择元素）。 如果您只想为div添加相同的样式，只需使用css类。

Answer 7

Unique：

  

在数学和逻辑学中，短语“只有一个”用于表示只存在一个具有某种属性的对象。

#div1 #loading无法解决您在your document中有两个#loading个实例的问题。所以，不，不要这样做。

Answer 8

这是正常的吗？否。

是否推荐？当然不！它实际上是被禁止的（但执法力度很弱）。

但它（显然）有效，所以......

Answer 9

Id用于区分元素，它们必须是唯一的，因为不同的原因，其中一个是使用javascript，如果你有重复的ID，getElementById这样的函数将无法正常工作，你将无法预测什么它会在不同的浏览器上执行，因为JS在每个浏览器上都是自我实现的。

如果你想使用#div loading和#div2加载这样的结构，似乎很清楚两个加载都有类似的用途，所以它们应该是类，并且会像这样使用

#div1.loading和#div2.loading

使用这种语法的另一个好处是将公共样式放在.loading中，就像这样

.loading {style common加载}

#div1.loading {style仅用于div1中的加载}

#div2.loading {样式仅由div2中的加载使用}

Answer 10

https://www.w3.org/TR/1999/REC-html401-19991224/struct/global.html#adef-id

BUT！

如果您在项目中需要它，可以使用它，就像我的 问题最终更新 中建议的那样！

Answer 11

除了验证和纯粹主义之外，它是完美的功能。但是如果我使用#loading id并发现jquery效果或css效果适用于1个以上的元素，我肯定会生气。请告诉我IE6或7或Firefox 1.x或2.x是否会破坏该代码。

Answer 12

在元素上使用我是不好的做法。因为我会用他们的名字识别来提供一些独特的理解。第二件事我们在CSS中使用它，但在JavaScript中这是一种不好的做法。这个班级和学生的好例子。

所以不要这样做。

Answer 13

我不同意人们说总是使用“独特”，这意味着每次标注一个ID时都会使用不同的ID。有时它是可以接受的，例如我在制作计算器的情况。

javascript正在进行数学运算并将结果输出到id为“total”的div中。但是，我需要在两个不同的地方使用相同的“总数”。在这种情况下，为什么我不会使用具有相同ID的两个不同的div？我在两个盒子里都需要相同的数字。使用jQuery，我执行并输出一次数学，它同时填充两个div，这就是我想要的。

只要您了解如果您从具有相同ID的那两个div中提取信息的风险，那么我说是免费的。只要你不要混淆自己，并且在同一个div ID中需要2个不同的结果。