07/10/2020 NodeList - Web APIs | MDN

Sign in

English ▼

NodeList

NodeList objects are collections of nodes, usually returned by properties such as

Node.childNodes and methods such as document.querySelectorAll() .

Although NodeList is not an Array , it is possible to iterate over it with forEach() . It

can also be converted to a real Array using Array.from() .

However, some older browsers have not implemented NodeList.forEach() nor

Array.from() . This can be circumvented by using Array.prototype.forEach() —
see this document's Example.

Live vs. Static NodeLists

Although they are both considered NodeList s, there are 2 varieties of NodeList: live and
static.

Live NodeLists
In some cases, the NodeList is live, which means that changes in the DOM automatically
update the collection.

For example, Node.childNodes is live:

1 const parent = document.getElementById('parent');

2 let child_nodes = parent.childNodes;
3 console.log(child_nodes.length); // let's assume "2"
4 parent.appendChild(document.createElement('div'));
5 console.log(child_nodes.length); // outputs "3"

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 1/10
07/10/2020 NodeList - Web APIs | MDN

Static NodeLists
In other cases, the NodeList is static, where any changes in the DOM does not affect the
content of the collection. The ubiquitous document.querySelectorAll() method returns a
static NodeList .

It's good to keep this distinction in mind when you choose how to iterate over the items in the
NodeList , and whether you should cache the list's length .

Properties
NodeList.length
The number of nodes in the NodeList .

Methods
NodeList.item()
Returns an item in the list by its index, or null if the index is out-of-bounds.

An alternative to accessing nodeList[i] (which instead returns undefined when i is

out-of-bounds). This is mostly useful for non-JavaScript DOM implementations.

NodeList.entries()
Returns an iterator , allowing code to go through all key/value pairs contained in the
collection. (In this case, the keys are numbers starting from 0 and the values are nodes.)

NodeList.forEach()
Executes a provided function once per NodeList element, passing the element as an
argument to the function.

NodeList.keys()
Returns an iterator , allowing code to go through all the keys of the key/value pairs
contained in the collection. (In this case, the keys are numbers starting from 0 .)

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 2/10
07/10/2020 NodeList - Web APIs | MDN

NodeList.values()
Returns an iterator allowing code to go through all values (nodes) of the key/value pairs
contained in the collection.

Example
It's possible to loop over the items in a NodeList using a for loop:

1 for (let i = 0; i < myNodeList.length; i++) {

2 let item = myNodeList[i];
3 }

Don't use for...in to enumerate the items in NodeList s, since they will also enumerate
its length and item properties and cause errors if your script assumes it only has to deal
with element objects. Also, for..in is not guaranteed to visit the properties in any
particular order.

for...of loops will loop over NodeList objects correctly:

1 const list = document.querySelectorAll('input[type=checkbox]');

2 for (let checkbox of list) {
3 checkbox.checked = true;
4 }

Recent browsers also support iterator methods ( forEach() ) as well as entries() ,

values() , and keys() .

There is also an Internet Explorer-compatible way to use Array.prototype.forEach for

iteration:

1 const list = document.querySelectorAll('input[type=checkbox]');

2 Array.prototype.forEach.call(list, function (checkbox) {
3 checkbox.checked = true;
4 });

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 3/10
07/10/2020 NodeList - Web APIs | MDN

Specifications
Specification Status Comment

DOM LS Living
The definition of 'NodeList' in that specification. Standard

Document Object Model (DOM) Level 3 Core

Specification Obsolete
The definition of 'NodeList' in that specification.

Document Object Model (DOM) Level 2 Core

Specification Obsolete
The definition of 'NodeList' in that specification.

Document Object Model (DOM) Level 1 Specification Initial

Obsolete
The definition of 'NodeList' in that specification. definition.

Browser compatibility
Update compatibility data on GitHub

NodeList

Chrome 1

Edge 12

Firefox 1

IE 8

Opera 8

Safari 3

WebView Android 1

Chrome Android 18

Firefox Android 4

Opera Android 10.1

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 4/10
07/10/2020 NodeList - Web APIs | MDN

Safari iOS 1

Samsung Internet Android 1.0

entries

Chrome 51

Edge 16

Firefox 50

IE No

Opera 38

Safari 10

WebView Android 51

Chrome Android 51

Firefox Android 50

Opera Android ?

Safari iOS 10

Samsung Internet Android 5.0

forEach

Chrome 51

Edge 16

Firefox 50

IE No

Opera 38

Safari 10

WebView Android 51

Chrome Android 51

Firefox Android 50

Opera Android 41

Safari iOS 10

Samsung Internet Android 5.0

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 5/10
07/10/2020 NodeList - Web APIs | MDN

item

Chrome 1

Edge 12

Firefox Yes

IE ?

Opera Yes

Safari Yes

WebView Android Yes

Chrome Android Yes

Firefox Android Yes

Opera Android Yes

Safari iOS Yes

Samsung Internet Android Yes

keys

Chrome 51

Edge 16

Firefox 50

IE No

Opera 38

Safari 10

WebView Android 51

Chrome Android 51

Firefox Android 50

Opera Android ?

Safari iOS 10

Samsung Internet Android 5.0

length

Chrome 1

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 6/10
07/10/2020 NodeList - Web APIs | MDN

Edge 12

Firefox Yes

IE ?

Opera Yes

Safari Yes

WebView Android Yes

Chrome Android Yes

Firefox Android Yes

Opera Android Yes

Safari iOS Yes

Samsung Internet Android Yes

values

Chrome 51

Edge 16

Firefox 50

IE No

Opera 38

Safari 10

WebView Android 51

Chrome Android 51

Firefox Android 50

Opera Android ?

Safari iOS 10

Samsung Internet Android 5.0

What are we missing?

Full support

No support

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 7/10
07/10/2020 NodeList - Web APIs | MDN

Compatibility unknown

Last modified: Jun 5, 2020, by MDN contributors

Related Topics
Document Object Model

NodeList

▼ Properties

length

▼ Methods

entries()

forEach()

item()

keys()

values()

▼ Related pages for DOM

AbortController

AbortSignal

AbstractRange

Attr

ByteString

CDATASection

CSSPrimitiveValue

CSSValue

CSSValueList

CharacterData
https://developer.mozilla.org/en-US/docs/Web/API/NodeList 8/10
07/10/2020 NodeList - Web APIs | MDN
CharacterData

ChildNode

Comment

CustomEvent

DOMConfiguration

DOMError

DOMErrorHandler

DOMException

DOMImplementation

DOMImplementationList

DOMImplementationRegistry

DOMImplementationSource

DOMLocator

DOMObject

DOMParser

DOMPoint

DOMPointInit

DOMPointReadOnly

DOMRect

DOMString

DOMTimeStamp

DOMTokenList

DOMUserData

Document

DocumentFragment

DocumentType

Element

ElementTraversal

Entity

EntityReference

Event

EventTarget

HTMLCollection

MutationObserver

Node
https://developer.mozilla.org/en-US/docs/Web/API/NodeList 9/10
07/10/2020 NodeList - Web APIs | MDN
Node

NodeFilter

NodeIterator

NonDocumentTypeChildNode

ProcessingInstruction

PromiseResolver

Range

StaticRange

Text

TextDecoder

TextEncoder

TimeRanges

TreeWalker

TypeInfo

USVString

UserDataHandler

XMLDocument

Learn the best of web development

Get the latest and greatest from MDN delivered straight to your inbox.

you@example.com

Sign up now

https://developer.mozilla.org/en-US/docs/Web/API/NodeList 10/10