Does ID have to be unique in the whole page?

Question

I am using jQuery and I am just wondering, does ID have to be always unique in the whole page? Class, I know, can be repeated as many times as you like, what about ID?

Answer 1

Yes, it must be unique.

HTML4:

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

Section 7.5.2:

id = name [CS] This attribute assigns a name to an element. This name must be unique in a document.

HTML5:

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

The id attribute specifies its element's unique identifier (ID). The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.

Answer 2

Does an ID have to be unique in the whole page?

No.

Because the HTML Living Standard ^{of September 7, 2021,} clearly states:

The class, id, and slot attributes may be specified on all HTML elements. ……. When specified on HTML elements, the id attribute value must be unique amongst all the IDs in the element’s tree and must contain at least one character. The value must not contain any ASCII whitespace.

and a page may have several DOM trees. It does, for example, when you’ve attached (Element.attachShadow()) a shadow DOM tree to an element.

---

TL; DR

Does an ID have to be unique in the whole page?

No.

Does an ID have to be unique in a DOM tree?

Yes.