The HTMLCollection
interface represents a generic collection (array-like object similar to arguments) of elements (in document order) and offers methods and properties for selecting from the list.
HTMLCollection
for historical reasons (before the modern DOM, collections implementing this interface could only have HTML elements as their items).An HTMLCollection
in the HTML DOM is live; it is automatically updated when the underlying document is changed.
Properties
HTMLCollection.length
Read only- Returns the number of items in the collection.
Methods
HTMLCollection.item()
- Returns the specific node at the given zero-based
index
into the list. Returnsnull
if theindex
is out of range. HTMLCollection.namedItem()
- Returns the specific node whose ID or, as a fallback, name matches the string specified by
name
. Matching by name is only done as a last resort, only in HTML, and only if the referenced element supports thename
attribute. Returnsnull
if no node exists by the given name.
Usage in JavaScript
HTMLCollection also
exposes its members directly as properties by both name and index. HTML IDs may contain : and . as valid characters, which would necessitate using bracket notation for property access. Currently HTMLCollections does not recognize purely numeric IDs, which would cause conflict with the array-style access, though HTML5 does permit these.
For example, assuming there is one <form>
element in the document and its id
is "myForm"
:
var elem1, elem2; // document.forms is an HTMLCollection elem1 = document.forms[0]; elem2 = document.forms.item(0); alert(elem1 === elem2); // shows: "true" elem1 = document.forms.myForm; elem2 = document.forms.namedItem("myForm"); alert(elem1 === elem2); // shows: "true" elem1 = document.forms["named.item.with.periods"];
Browser compatibility
Different browsers behave differently when there are more than one elements matching the string used as an index (or namedItem
's argument). Firefox 8 behaves as specified in DOM 2 and DOM4, returning the first matching element. WebKit browsers and Internet Explorer in this case return another HTMLCollection
and Opera returns a NodeList
of all matching elements.
Specifications
Specification | Status | Comment |
---|---|---|
DOM The definition of 'HTMLCollection' in that specification. |
Living Standard | |
Document Object Model (DOM) Level 2 HTML Specification The definition of 'HTMLCollection' in that specification. |
Recommendation | |
Document Object Model (DOM) Level 1 Specification The definition of 'HTMLCollection' in that specification. |
Recommendation | Initial definition. |