CODEWITHSUNDEEP
javascriptjqueryhtml
gel
gel

Reputation: 301

Does length of ID matter in jQuery?

I have some trouble with getting an element by id. My HTML looks something like this: 

<div id="F6fsCKVqdAXAXUlRAAAC0zwj8s9QQUKp0riVAAAD"></div>
<li class="active" id="F6fsCKVqdAXAXUlRAAAC0zwj8s9QQUKp0riVAAAD"></li>

When I use an ID like this, I only get the li element. Picture of result.

But when I try with another, shorter id - like this:

<div id="room1"></div>
<li class="active" id="room1"></li>

Then I get both elements. Picture of result

I don't understand this behaviour, someone care to explain?

Upvotes: 0

Views: 173

Answers (2)

Andr&#233;
Andr&#233;

Reputation: 323

An ID, like the name suggests, must be the unique across the HTML document.

The id global attribute defines a unique identifier (ID) which must be unique in the whole document

An alternative would be using a different ID to represent your li element or a class, like you used for representing the active state.

Upvotes: 1

I wrestled a bear once.
I wrestled a bear once.

Reputation: 23379

Yes, in that it must be at least one char. There is no Max.

From the W3C:

3.2.3.1 The id attribute

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.

An element's unique identifier can be used for a variety of purposes, most notably as a way to link to specific parts of a document using fragment identifiers, as a way to target an element when scripting, and as a way to style a specific element from CSS.

If the value is not the empty string, user agents must associate the element with the given value (exactly, including any space characters) for the purposes of ID matching within the element's home subtree (e.g. for selectors in CSS or for the getElementById() method in the DOM).

Identifiers are opaque strings. Particular meanings should not be derived from the value of the id attribute.

This specification doesn't preclude an element having multiple IDs, if other mechanisms (e.g. DOM Core methods) can set an element's ID in a way that doesn't conflict with the id attribute.

The id IDL attribute must reflect the id content attribute.

Upvotes: 3

Related Questions