Nearby lessons

13 of 14

JavaScript HTML DOM Collections

📌 What are DOM Collections?

In JavaScript, DOM methods like getElementsByTagName() and getElementsByClassName() return a live collection of HTML elements called HTMLCollection.

📚 The HTMLCollection Object

HTMLCollection is an array-like object that represents a collection of HTML elements. It is live, meaning changes in the DOM are reflected in the collection automatically.

You can access items using index numbers or the item name.

  • document.getElementsByTagName()
  • document.getElementsByClassName()
  • element.children
Code Example
PREVIEW READY
Loading Editor...
Live Preview

🔢 Accessing Items in HTMLCollection

You can access individual elements using:

  • collection[index]
  • collection.item(index)
Code Example
PREVIEW READY
Loading Editor...
Live Preview

🧒 Using children Property

The children property returns an HTMLCollection of child elements (excluding text and comment nodes).

Code Example
PREVIEW READY
Loading Editor...
Live Preview

🧠 Test Your Knowledge

3 Questions

Progress: 0 / 3
Keep Going!JavaScript DOM Node Lists