两个 html 元素可以具有相同的 id 但属于不同的类吗？

Posted 2023-02-18

【中文标题】两个 html 元素可以具有相同的 id 但属于不同的类吗？

【英文标题】：Can two html elements have the same id but in different classes?

【发布时间】：2016-02-15 23:54:00

【问题描述】：

我正在为现有应用程序编写一个 javascript，其中有两个具有单独 id 的表单，每个表单中都有一个 div，其 id 为 "validationSummary"。但是这些divs 属于不同的类。所以我的问题是这可能吗？请任何人都可以向我解释这是正确的吗？

这些是divs：

<form id="foo" .....>
<div class="notice_bar validation-summary-errors error_message" id="validationSummary"></div>
</form>

<form id="bar" .....>
<div class="validation-summary-valid notice_bar affirmative_message" id="validationSummary"></div>
</form>

而且notice_bar 类也很常见，会导致其他混乱！

【问题讨论】：

你试过了吗？对的，这是可能的。不，这是不正确的。普通类notice_bar 会导致什么混乱？

ID 是唯一的。只使用一次。参考validationSummary

@Igor ：notice_bar 类现在有两个具有相同 ID 的 div 元素。不会是冲突吗？顺便说一句，这就是我正在寻找的答案。谢谢。

@Necromancer - css 类用于多个元素，无论元素的 id 是什么

【参考方案1】：

可能吗？是的。 编码好？没有。

来自w3.org：

ID 和 NAME 标记必须以字母 ([A-Za-z]) 开头，并且可以是 后跟任意数量的字母、数字 ([0-9])、连字符 ("-")、 下划线（“_”）、冒号（“:”）和句点（“.”）。

【参考方案2】：

元素的唯一标识符。

必须在一个文档中不能有多个元素具有相同的 id 值。

取自w3.org。

id 属性为 html 元素指定一个唯一的 id（该值在 HTML 文档中必须是唯一的）。

取自W3Schools。

【参考方案3】：

它应该可以正常工作，但这不是一个好习惯。冗余不一定是好事。

【参考方案4】：

它应该可以工作...我在一个创建相同 ID 的应用程序上工作，并且我曾经在页面上同时拥有相同的 ID。这不是一个好习惯，因为 ID 是唯一的，但除非您需要使用一些 JavaScript 从该特定 ID（在您的情况下为 validationSummary ）运行某些东西，否则它应该可以工作。如前所述，这不是 ID 的意义所在。