Home JavaScript NodeList Methods entries() JavaScript NodeList entries() Method Definition NodeList.entries() returns an iterator of [index, node] pairs (MDN) . Loop with for...of to walk every key/value pair in the list.
Pass the required arguments shown below. Check return values and browser support before you rely on the result.
Syntax Call nodeList.entries. Start with this line.
Call What it does nodeList.entries()Primary signature. nodeList.entries(...)Call with the arguments your case needs.
Built into the browser. Call entries(...) on a NodeList — no import required.
Library declarations Parameters This member has no parameters beyond those shown in the signature.
Return Value Return Value Description * Iterator of [index, Node]
JavaScript Examples 1. for...of 2. Destructure 3. querySelectorAll 4. Array.from 5. vs keys/values Example 1 — for...of Over entries() MDN pattern: walk childNodes.entries() and read each pair.
const node = document.createElement("div");
node.appendChild(document.createElement("p"));
node.appendChild(document.createTextNode("hey"));
node.appendChild(document.createElement("span"));
const lines = [];
for (const entry of node.childNodes.entries()) {
const index = entry[0];
const child = entry[1];
lines.push(index + " " + child.nodeName);
}
console.log(lines.join(", ")); // 0 P, 1 #text, 2 SPAN How It Works Create a parent. Append three child nodes.Call entries(). No parameters.Read the pair. entry[0] is the index; entry[1] is the node.Print nodeName. Text nodes show as #text.Example 2 — Destructuring Unpack [index, node] in the for...of header.
const node = document.createElement("div");
node.appendChild(document.createElement("p"));
node.appendChild(document.createElement("span"));
const lines = [];
for (const [index, child] of node.childNodes.entries()) {
lines.push(index + "→" + child.nodeName);
}
console.log(lines.join(" | ")); // 0→P | 1→SPAN How It Works Same iterator. Still list.entries().Destructure each step. Cleaner than entry[0] / entry[1].Use both values. Index for labels; node for DOM work.Tip. Works the same on querySelectorAll lists.Example 3 — querySelectorAll Static NodeLists from selectors also support entries().
// Imagine: <ul id="fruit"><li>Apple</li><li>Banana</li><li>Cherry</li></ul>
const items = document.querySelectorAll("#fruit li");
const lines = [];
for (const [i, el] of items.entries()) {
lines.push(i + ": " + el.textContent);
}
console.log(lines.join(", ")); // 0: Apple, 1: Banana, 2: Cherry 0: Apple, 1: Banana, 2: Cherry How It Works Select elements. querySelectorAll returns a NodeList.Iterate pairs. Same entries() API as childNodes.Read text. Use the node half of each pair.Static list. Unlike live childNodes, this snapshot does not update if the DOM changes later.Example 4 — Array.from Materialize the iterator into a real array of pairs.
const node = document.createElement("div");
node.appendChild(document.createElement("p"));
node.appendChild(document.createElement("span"));
const pairs = Array.from(node.childNodes.entries(), ([i, n]) => {
return [i, n.nodeName];
});
console.log(JSON.stringify(pairs)); // [[0,"P"],[1,"SPAN"]] How It Works Pass the iterator. Array.from(list.entries()).Optional map. Second argument transforms each pair.Get a real array. Useful for map / filter later.Cost. You copy all pairs into memory — fine for small lists.Example 5 — vs keys() / values() See what each iterator yields from the same NodeList.
const node = document.createElement("div");
node.appendChild(document.createElement("p"));
node.appendChild(document.createElement("span"));
const list = node.childNodes;
console.log("keys:", Array.from(list.keys()).join(","));
// 0,1
console.log("values:", Array.from(list.values(), (n) => n.nodeName).join(","));
// P,SPAN
console.log(
"entries:",
Array.from(list.entries(), ([i, n]) => i + ":" + n.nodeName).join(",")
);
// 0:P,1:SPAN keys: 0,1
values: P,SPAN
entries: 0:P,1:SPAN How It Works keys()values()entries()Pick one. Use entries() when you need the index and the node in the same loop.Compatibility
Browser Support NodeList.entries() is marked Baseline Widely available on MDN (since October 2017). DOM API — not a Node.js built-in.
✓ Baseline · Widely available
entries() Iterate [index, node] pairs on NodeList across modern browsers.
Chrome 51+
Full support
Edge 16+
Full support
Firefox 50+
Full support
Safari 10+
Full support
Opera 38+
Full support HTML element 100% supported
Bottom line: Safe for production. Prefer for...of over entries() when you need both the index and the node.
Frequently Asked Questions What does NodeList.entries() return? An iterator of key/value pairs. Each step yields [index, node], where index is a number and node is a Node (Element, Text, etc.).
Is entries() deprecated or experimental? No. MDN marks NodeList.entries() as Baseline Widely available (since October 2017). It is not Deprecated, Experimental, or Non-standard.
How is entries() different from keys() and values()? keys() yields indexes only. values() yields Node objects only. entries() yields both as [index, node] pairs.
How is it different from forEach()? forEach() runs a callback for each node immediately. entries() returns a lazy iterator you loop with for...of, or turn into an array with Array.from / spread.
Does entries() change the DOM? No. It only iterates existing nodes. It does not add, remove, or mutate nodes by itself.
Which NodeLists support entries()? Modern NodeLists do — including node.childNodes and the list from document.querySelectorAll(...).
Next: forEach() Run a simple callback for every node in the list.
forEach() → About the author Developer, cloud engineer, and technical writer
I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.
8 people found this page helpful
