0Pricing
JavaScript Academy · Lesson

NodeList vs HTMLCollection

Understand the differences between element collections.

Two Collection Types

DOM methods return one of two list-like objects: a NodeList or an HTMLCollection. They look similar but differ in important ways.

Where NodeList Comes From

querySelectorAll and childNodes return NodeList objects. The one from querySelectorAll is static: a snapshot taken at query time.

const items = document.querySelectorAll(".item"); // static NodeList

All lessons in this course

  1. Selecting Elements with querySelector
  2. getElementById and getElementsByClassName
  3. Traversing Parents, Children and Siblings
  4. NodeList vs HTMLCollection
← Back to JavaScript Academy