NodeList
objects are collections of nodes such as those returned by {{domxref("Node.childNodes")}} and the {{domxref("document.querySelectorAll")}} method.
Although NodeList
is not an Array
, it is possible to iterate on it using forEach()
. Older browsers doesn't implement this method yet.
Properties
- {{domxref("NodeList.length")}}
- The number of nodes in the
NodeList
.
Methods
- {{domxref("NodeList.item()", "NodeList.item(idx)")}}
- Returns an item in the list by its index, or
null
if the index is out-of-bounds; can be used as an alternative to simply accessingnodeList[idx]
(which instead returnsundefined
whenidx
is out-of-bounds). - {{domxref("NodeList.entries()")}}
- Returns an {{jsxref("Iteration_protocols","iterator")}} allowing to go through all key/value pairs contained in this object.
- {{domxref("NodeList.forEach()")}}
- Executes a provided function once per
NodeList
element. - {{domxref("NodeList.keys()")}}
- Returns an {{jsxref("Iteration_protocols", "iterator")}} allowing to go through all keys of the key/value pairs contained in this object.
- {{domxref("NodeList.values()")}}
- Returns an {{jsxref("Iteration_protocols", "iterator")}} allowing to go through all values of the key/value pairs contained in this object.
Example
It's possible to loop over the items in a NodeList
using:
for (var i = 0; i < myNodeList.length; ++i) { var item = myNodeList[i]; // Calling myNodeList.item(i) isn't necessary in JavaScript }
Don't be tempted to use for...in
or for each...in
to enumerate the items in the list, since that will also enumerate the length and item properties of the NodeList
and cause errors if your script assumes it only has to deal with {{domxref("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:
var list = document.querySelectorAll( 'input[type=checkbox]' ); for (var item of list) { item.checked = true; }
Recent browsers also supports iterator methods, {{domxref("NodeList.forEach()", "forEach()")}}, as well as {{domxref("NodeList.entries()", "entries()")}}, {{domxref("NodeList.values()", "values()")}}, and {{domxref("NodeList.keys()", "keys()")}}
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('DOM WHATWG', '#interface-nodelist', 'NodeList')}} | {{ Spec2('DOM WHATWG') }} | |
{{SpecName('DOM4', '#interface-nodelist', 'NodeList')}} | {{ Spec2('DOM4') }} | |
{{SpecName('DOM3 Core', 'core.html#ID-536297177', 'NodeList')}} | {{ Spec2('DOM3 Core') }} | |
{{SpecName('DOM2 Core', 'core.html#ID-536297177', 'NodeList')}} | {{ Spec2('DOM2 Core') }} | |
{{SpecName('DOM1', 'level-one-core.html#ID-536297177', 'NodeList')}} | {{ Spec2('DOM1') }} | Initial definition. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
entries() , keys() , values() , forEach() |
{{CompatUnknown}} | {{CompatGeckoDesktop("50.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
Feature | Android | Android Webview | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
entries() , keys() , values() , forEach() |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("50.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |