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.lengthRead only- Returns the number of items in the collection.
Methods
HTMLCollection.item()- Returns the specific node at the given zero-based
indexinto the list. Returnsnullif theindexis out of range. - An alternative to accessing
collection[i](which instead returnsundefinedwheniis out-of-bounds). This is mostly useful for non-JavaScript DOM implementations. 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 thenameattribute. Returnsnullif no node exists by the given name. - An alternative to accessing
collection[name](which instead returnsundefinedwhennamedoes not exist). This is mostly useful for non-JavaScript DOM implementations.
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"];
Specifications
| Specification | Status | Comment |
|---|---|---|
| DOM The definition of 'HTMLCollection' in that specification. |
Living Standard |
Browser compatibility
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
HTMLCollection | Chrome Full support 1 | Edge Full support 12 | Firefox Full support 1 | IE Full support 8 | Opera Full support 8 | Safari Full support 4 | WebView Android Full support 1 | Chrome Android Full support 18 | Firefox Android Full support 4 | Opera Android Full support 10.1 | Safari iOS Full support 3.2 | Samsung Internet Android Full support 1.0 |
item | Chrome Full support Yes | Edge Full support 12 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
length | Chrome Full support Yes | Edge Full support 12 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
namedItem | Chrome Full support Yes | Edge Full support 12 | Firefox Full support Yes | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- Compatibility unknown
- Compatibility unknown
