21

Needed to know if an HTML element can have multiple attributes of ID's, for instance :

<input type="text" id="identifier1" id="selector1" />

As I needed to clarify this statement mentioned about selectors at W3 website.

If an element has multiple ID attributes, all of them must be treated as IDs for that element for the purposes of the ID selector. Such a situation could be reached using mixtures of xml:id, DOM3 Core, XML DTDs, and namespace-specific knowledge.

The Possible duplicates which people are referring, states question for this syntax

<input type="text" id="identifier1 selector1" />

which is different than syntax that I am asking.

Abhishek Madhani
  • 1,155
  • 4
  • 16
  • 26
  • 1
    Refer this link ( Same question at StackOverflow ) : http://stackoverflow.com/questions/192048/can-an-html-element-have-multiple-ids – Rubyist Jun 05 '13 at 09:25
  • Please go through [this answer and comments](http://stackoverflow.com/a/5685221/309086) on similar question asked earlier. – Aziz Shaikh Jun 05 '13 at 09:27

6 Answers6

29

Needed to know if an HTML element can have multiple attributes of ID's

Short answer? No because the browser will only render the first one.

See this Fiddle, I can only target it in CSS using the first id that appears in the DOM. Try changing that CSS selector to use the second id, it won't work.

That's because it seems like the second ID is being disregarded by the browser, as this is the output HTML:

<input type="text" id="identifier1">

If you really need additional identifiers on an element, you should think about using either multiple class names or data attributes to correspond to additional data.

Mathew Thompson
  • 55,877
  • 15
  • 127
  • 148
  • What about the performance of looking up data attribute values? modern browser versions are very efficient about looking up ID's, how does it compare to data attributes? – matanster Nov 24 '13 at 20:31
  • 2
    http://jsfiddle.net/S9R8Y/72/ multiple ids works like one with spaces – jt3k Jun 15 '15 at 13:08
6

Needed to know if an HTML element can have multiple attributes of ID's

No. No element in HTML may have more then one instance of a given attribute.

As I needed to clarify this statement

Note the last sentence in that statement.

Also note that the CSS idea of an "ID attribute" is not "An attribute with the name id". Also quoting from that document:

Document languages may contain attributes that are declared to be of type ID

Only the id attribute is an ID type in HTML.

Tapan Nallan
  • 1,762
  • 3
  • 17
  • 37
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • 2
    @mattytommo You can't target it because the second ID doesn't "exist" on the element in the DOM. Also, it's invalid HTML to have more than one ID on an element. – dsgriffin Jun 05 '13 at 09:36
4

No, even if you specify multiple ids, the first encountered id attribute is used.

Martijn Pieters
  • 1,048,767
  • 296
  • 4,058
  • 3,343
Tapan Nallan
  • 1,762
  • 3
  • 17
  • 37
  • 1
    When I verified both on chrome as well as IE, only the first id attribute is retained. you cannot use the other id attributes – Tapan Nallan Jun 05 '13 at 09:31
1

No ID can not be same for html elements, but the Classes are to use for multiple elements, and one element may have multiple classes

Abuzer Firdousi
  • 1,552
  • 1
  • 10
  • 25
1

No, because an attribute must not be repeated in tag. This is a general rule in HTML, not limited to the id attribute. For nominally SGML-based versions of HTML and for XHTML, this follows from general SGML and XML rules. For HTML serialized HTML5, see HTML5 CR, 8.1.2.3 Attributes.

It’s difficult to see why you would use duplicate id attributes, so I can’t suggest a workaround. In general, for any normal use of the id attribute, one attribute per element is sufficient.

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
0

No. Element IDs should be unique within the entire document.

Rubyist
  • 6,486
  • 10
  • 51
  • 86
  • i ensure that ids are always unique to the entire document, can an element have multiple unique id's, I should rephrase my question i guess. – Abhishek Madhani Jun 05 '13 at 09:28
  • I have not tried this multiple ids for any element. But assume that first word will be acts as unique id for that element. for example: , then in this case I think browser will look through test1 as id by escaping the test3. Not sure. – Rubyist Jun 05 '13 at 09:50