For the More Curious: NodeLists and HTMLCollections

There are two ways to retrieve lists of elements that live in the DOM. The first one is document.querySelectorAll, which returns a NodeList. The other is document.getElementsByTagName, which differs from document.querySelectorAll in that you can only pass it a string with a tag name, like "div" or "a", and also in that it returns an HTMLCollection.

Neither NodeLists nor HTMLCollections are true arrays, so they lack array methods such as forEach, but they do have some very interesting properties.

HTMLCollections are live nodes. This means that when changes are made to the DOM, the contents of an HTMLCollection can change without you having to call document.getElementsByTagName

Get Front-End Web Development: The Big Nerd Ranch Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.