Is Element.tagName always uppercase?

Reading at MDN about Element.tagName it states:

On HTML elements in DOM trees flagged as HTML documents, tagName returns the element name in the uppercase form.

My question is: is this trustable? Does IE (old and modern) behave as expected? Is this likely to change? or is it better to always work with el.tagName.toLowerCase()?


Solution 1:

You don't have to toLowerCase or whatever, browsers do behave the same on this point (surprisingly huh?).

About the rationale, once I had discussion with a colleague who's very professional on W3C standards. One of his opinions is that using uppercase TAGNAME would be much easier to recognize them out of user content. That's quite persuasive for me.


Edit: As @adjenks says, XHTML doctype returns mixed-case tagName if the document is served as Content-Type: application/xhtml+xml. Test page: http://programming.enthuses.me/tag-node-case.php?doc=x

Technically, please read this spec for more info: http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-745549614

Note that this (tagName) is case-preserving in XML, as are all of the operations of the DOM. The HTML DOM returns the tagName of an HTML element in the canonical uppercase form, regardless of the case in the source HTML document.

As of asker's question: this is trustable. Breaking change is not likely to happen in HTML spec.

Solution 2:

In WebKit/Chromium it is not trustable, WebKit can create tagName properties also in lowercase, most of web pages builds uppercase tagName's, but it is also possible to build lowercase values, so if you use WebKit you must be prepare to support both cases. I thought tagName's are allways uppercase(most of are) and I see I was wrong, now I must little fix my script :)

chrome's inspector screenshot here

EDIT: console.log