【问题标题】:Does ID have to be unique in the whole page?ID 在整个页面中必须是唯一的吗?
【发布时间】:2012-03-16 07:31:37
【问题描述】:

我正在使用 jQuery,我只是想知道,ID 在整个页面中是否必须始终是唯一的?课程,我知道,可以重复多次,ID呢?

【问题讨论】:

  • 一个id属性一般只使用一次,因为一个ID是唯一的
  • 如果您认为可以,您不能覆盖 ID 的定义。

标签: html css


【解决方案1】:

我要补充这个问题,因为我觉得以上任何一个问题都没有得到充分的回答,

作为参考:我已经实现了非唯一 id,并且一切正常(在所有浏览器中)。重要的是,在编码时,我没有遇到任何 css 逻辑错误,这是橡胶在这个问题上遇到的问题(IMO)。在 js 中也没有遇到任何冲突(因为可以在类的上下文中收集 id)

那么,为什么 id 必须是唯一的?明显的答案(如上所述并重申)是'因为'标准'这样说。对我来说缺少的部分是为什么?

即如果(天堂禁止)有人无意中使用了两次相同的 ID,实际上会出现什么问题(或者理论上可能会出现问题)?

【讨论】:

    【解决方案2】:

    ID 在整个页面中是否必须是唯一的

    没有。

    因为the HTML Living Standard2021 年 9 月 7 日 明确指出:

    classidslot 属性可以在所有 HTML 元素上指定。 ……。 在 HTML 元素 上指定时,id 属性值必须在元素的 中的所有 ID唯一> 并且必须至少包含一个字符。该值不得包含任何 ASCII 空格

    并且一个页面可能有多个DOM 树。例如,当您将 (Element.attachShadow()) 一个 shadow DOM tree 附加到一个元素时,它确实如此。


    TL;博士

    ID 在整个页面中是否必须是唯一的

    没有。

    ID 在 DOM 树中是否必须是唯一的

    是的。

    【讨论】:

      【解决方案3】:

      是的,它必须是唯一的。

      HTML4:

      https://www.w3.org/TR/html4/struct/global.html#h-7.5.2

      第 7.5.2 节:

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

      HTML5:

      https://www.w3.org/TR/html5/dom.html#element-attrdef-global-id

      id 属性指定其元素的唯一标识符 (ID)。这 value 在元素的主子树中的所有 ID 中必须是唯一的 并且必须至少包含一个字符。该值不得包含 任何空格字符。

      【讨论】:

      • 在元素的 home 子树中的所有 ID 中。”子树。是的,sub-,树。
      【解决方案4】:

      从技术上讲,按照 HTML5 标准,页面上的 ID 必须是唯一的 - https://developer.mozilla.org/en/DOM/element.id

      但我曾在极度模块化的网站上工作过,在这些网站上完全忽略了这一点,但它确实有效。这是有道理的——最令人惊讶的部分。

      我们称之为“组件化”

      例如,您的页面上可能有一个组件,它是某种小部件。它的内部有自己独特的 ID,例如“ok-button”

      一旦页面上有许多这样的小部件,从技术上讲,您的 HTML 是无效的。但是,componentize 你的小部件是非常有意义的,这样它们每个都在内部引用自己的 ok 按钮,例如,如果使用 jquery 从它自己的根进行搜索,它可能是:$widgetRoot.find("#ok-button")

      这对我们有用,但从技术上讲,一旦 ID 不是唯一的,就根本不应该使用它们。

      如上所述,即使是 YouTube 也这样做,所以它并没有那么叛逆。

      【讨论】:

      • 我强烈反对。这是没有意义的,因为 ID 在页面上是唯一的,这与您的“组件化”想法强烈矛盾。那些重复出现的元素应该是类。您可以根据需要从其特定的独特容器之外定位它们。例如。 #ticker-widget .ok-button.
      【解决方案5】:

      2018 年 1 月,这里是 Youtube HTML ,你可以看到 id="button" id="info" 是重复的。

      【讨论】:

      • 您几乎不应该将大型动态网站的输出视为“有效代码”的先验示例。
      • 投反对票。仅仅因为 YouTube 跳下桥并不意味着我们应该这样做。
      【解决方案6】:

      https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really 对同一问题有很好的答案。

      One tidbit not mentioned above 是如果有几个相同的ids 一个相同的页面(发生这种情况,即使它违反了标准):

      如果你必须解决这个问题(很遗憾),你可以使用$("*#foo"),这将说服 jQuery 使用getElementsByTagName 并返回所有匹配元素的列表。

      【讨论】:

        【解决方案7】:

        使用 Javascript,您只能使用 ID 引用一个元素。 document.getElementById 和 jQuery 的 $ 选择器将只返回匹配的第一个元素。所以在多个元素上使用相同的 ID 是没有意义的。

        【讨论】:

          【解决方案8】:

          浏览器曾经对此很宽容(很多年前,当 css 还很年轻时)并允许多次使用 ID。他们变得更加严格。

          但是,是的,ID 必须是唯一的并且只能使用一次。

          如果您需要多次使用 css 格式,请使用 CLASS。

          【讨论】:

            【解决方案9】:

            这基本上就是 ID 的全部意义所在。 :) ID 是特定的,每页只能使用一次。上课可以随意使用。

            【讨论】:

              【解决方案10】:

              ID 必须始终是唯一的。

              每个人都有一个唯一的识别号码(例如社会安全号码),并且有很多人在一个社会阶层

              【讨论】:

                【解决方案11】:

                来自 mdn https://developer.mozilla.org/en/DOM/element.id

                所以我想最好是......

                【讨论】:

                  【解决方案12】:

                  是的,ID 是唯一的。类不是。

                  【讨论】:

                    猜你喜欢
                    • 1970-01-01
                    • 1970-01-01
                    • 2012-05-12
                    • 2013-05-23
                    相关资源
                    最近更新 更多