HTMLCollection

HTMLCollection is a DOM interface that represents a live collection of Element objects. It is typically produced by certain DOM methods and properties, such as document.getElementsByTagName, document.getElementsByClassName, and the collections document.forms, document.images, and document.links. A key characteristic is that the collection is live: changes to the document, such as adding or removing elements, are reflected automatically in the HTMLCollection.

As an object, an HTMLCollection is array-like but not a true Array. It exposes a length property and allows access by numeric index (coll[0], coll[1], etc.). It also provides methods including item(index) to retrieve an element by position and namedItem(name) to retrieve an element whose name or id matches the provided string. It does not implement all standard Array methods, so methods like push or forEach are not guaranteed to work directly. If needed, the collection can be converted to a real array using Array.from(collection) or Array.prototype.slice.call(collection).

Common sources of HTMLCollection include document.getElementsByTagName, document.getElementsByClassName, and several built-in collections such as document.forms, document.images, and document.links. Because the collection is live, it automatically reflects additions or removals in the document.

In practice, HTMLCollection is useful when you need a current view of a group of elements, but if a static snapshot is required, other APIs such as querySelectorAll (which returns a static NodeList) may be preferable. Converting to a true Array is also common when you need full array functionality.