Question

我有以下HTML。

div#main-content div#right-col div#post-show div#post-img div#post-img-large{

}
div#main-content div#right-col div#post-show div#post-img div#post-img-large 
   img#post-img-large{
}

正如你所看到的，我对div和img使用相同的id。

这是允许的吗？我知道它工作正常，但是如果我引用id post-img-large会让jQuery感到困惑吗？

Answer 1

以前的经验：

对于id选择器，jQuery使用JavaScript函数   document.getElementById（），效率极高。当另一个   selector附加到id选择器，例如h2＃pageTitle，jQuery   在将元素标识为a之前执行附加检查   匹配。

每个id值只能在文档中使用一次。如果超过   一个元素已分配相同的ID，使用该ID的查询   只会选择DOM中第一个匹配的元素。这种行为   但是，不应该依赖;包含多个文档的文档   使用相同ID的元素无效。

来源：http://api.jquery.com/id-selector/

Answer 2

不应在任何给定页面上的多个元素上使用

ID。它们用于唯一标识元素。

现在，在您的特定示例中，如果您正在使用jQuery，通过使用更多信息（div＃ID，img＃ID）对选择器进行限定，总是可以选择所需的元素 - jQuery不会混淆，但是你应该坚持标准而不是重复使用ID。

来自W3c： http://www.w3.org/TR/html4/struct/global.html（html4，但仍适用）

7.5.2 Element identifiers: the id and class attributes

Attribute definitions

id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.
class = cdata-list [CS]
This attribute assigns a class name or set of class names to an element. Any number of elements may be assigned the same class name or names. Multiple class names must be separated by white space characters.

Answer 3

检查http://www.w3.org

中的每个代码

Answer 4

这不是有效的html，id必须是唯一的。

是的，由于重复的ID，jquery可能无法按预期工作。事实上，几天前我在SO上看到了一个功能损坏的问题。

这是jquery的有效HTML

4 个答案: