JavaScript NodeList : Object

A list of Nodes similar to an Array. NodeLists are returned from various methods such as document.getElementsByClassName(), document.getElementsByTagName(), and document.querySelectorAll(). Note, the items in a NodeList may update as the underlying document updates, see the documentation for the API that created the NodeList for more details.

Spec

Instance Indexers

this[index : Number] : Node readonly

Returns the Node at the specified index. You can also use the item() method to retrieve the item.

Example:

<div>foo</div>
<div>bar</div>
<script>
  // getElementsByTagName returns a live NodeList
  var divsLive = document.getElementsByTagName('div');

  // querySelectorAll returns a static NodeList
  var divsStatic = document.querySelectorAll('div');

  console.log('divsLive.length = ' + divsLive.length);
  console.log('divsStatic.length = ' + divsStatic.length);
  for (var i = 0; i < divsLive.length; i++) {
    console.log(divsLive[i].textContent, divsStatic[i].textContent);
  }
  console.log();

  // The divsLive NodeList will update automatically when you add
  // another div
  var baz = document.createElement('div');
  baz.textContent = 'baz';
  document.body.appendChild(baz);

  console.log('after add divsLive.length = ' + divsLive.length);
  console.log('after add divsStatic.length = ' + divsStatic.length);
</script>

Run

Results:

Instance Properties

length : Number readonly

The number of Nodes in the list.

Example:

<div>foo</div>
<div>bar</div>
<script>
  // getElementsByTagName returns a live NodeList
  var divsLive = document.getElementsByTagName('div');

  // querySelectorAll returns a static NodeList
  var divsStatic = document.querySelectorAll('div');

  console.log('divsLive.length = ' + divsLive.length);
  console.log('divsStatic.length = ' + divsStatic.length);
  for (var i = 0; i < divsLive.length; i++) {
    console.log(divsLive[i].textContent, divsStatic[i].textContent);
  }
  console.log();

  // The divsLive NodeList will update automatically when you add
  // another div
  var baz = document.createElement('div');
  baz.textContent = 'baz';
  document.body.appendChild(baz);

  console.log('after add divsLive.length = ' + divsLive.length);
  console.log('after add divsStatic.length = ' + divsStatic.length);
</script>

Run

Results:

Spec

Instance Methods

item(index : Number) : Node

Same as this[index].

Spec

home license contribute feedback