What's in a NAME?

The little-used getElementsByName() method is part of the DOM Level 1 specification and is supported by both Internet Explorer and Mozilla/Firefox. getElementsByName() is part of the HTML application of the DOM, meaning it is specific to HTML documents, and explains why you won't find it in the DOM Core spec, which applies to any XML-like document.

Given a string as an argument, getElementsByName() retrieves all elements that have a NAME attribute that matches that string. Or does it?

<div name="foo">DIV one</div>
<div name="foo">DIV two</div>
<div name="foo">DIV three</div>

<script type="text/javascript">
var divs = document.getElementsByName("foo");
alert(divs.length);
</script>

Moz/Firefox will report a length of 3. MSIE will report a length of zero. Huh?

According to the HTML 4.01 spec, the only elements that support NAME attributes are BUTTON, TEXTAREA, APPLET, SELECT, FORM, FRAME, IFRAME, IMG, A, INPUT, OBJECT, MAP, PARAM and META. So to place a NAME inside a DIV is actually invalid HTML.

Moz/Firefox doesn't have a problem with this and will happily return all three DIV elements. But MSIE treats it the invalid NAME attribute as an expando attribute and excludes those elements. From the MSDN documentation:

"Elements that support both the NAME and the ID attribute are included in the collection returned by the getElementsByName method, but not elements with a NAME expando."

It seems that MSIE's implementation of getElementsByName() is actually more compliant with the W3C standard than Moz/Firefox's. Just not nearly as useful.