JavaScript NodeList item() Method

What You’ll Learn

The item() method of a NodeList returns a node by zero-based index. Learn how it compares with nodeList[index], what happens when the index is out of range (null), and how to loop with length—with five examples and try-it labs.

Introduction

A NodeList is ordered. When you need one node at a known position, call list.item(index). Indexes start at 0, so item(0) is the first node and item(1) is the second.

In JavaScript you can also write list[index]—MDN treats that as equivalent for reading a node by index. Prefer item() when you want an explicit method call, or when teaching DOM APIs that mirror older collection styles.

Understanding the item() Method

An instance method on NodeList that fetches the node at a given index.

• Parameter — index (zero-based).
• Returns — the node at that index, or null if out of range.
• Equivalent in JS — nodeList[index].
• No argument — throws TypeError.
• Baseline Widely available on MDN (since July 2015).

📝 Syntax

item(index)

Parameters

• index — the zero-based index of the node to fetch.

Return value

The node at that index, or null if the index is out of range.

Exceptions

TypeError if no argument is provided.

Typical pattern (MDN idea)

const list = document.querySelectorAll("li");
const second = list.item(1); // same idea as list[1]
// first item is index 0; index 1 is the second match

⚖️ item() vs Related Ideas

Examples Gallery

Examples follow MDN NodeList.item(). Labs use querySelectorAll / childNodes (true NodeLists) and the same index idea as MDN’s sample.

const list = document.querySelectorAll("li");
const second = list.item(1); // or list[1]
console.log(second && second.textContent);

Banana

const viaItem = list.item(0);
const viaBracket = list[0];
console.log(viaItem === viaBracket);

same: true

console.log(list.length);
console.log(list.item(99)); // null

length: 3
item(99): null

for (let i = 0; i < list.length; i++) {
  const node = list.item(i);
  console.log(i, node.nodeName);
}

0 LI
1 LI
2 LI

function readItem(list, index) {
  const node = list.item(index);
  return node ? node.textContent : "(missing)";
}

console.log(readItem(list, 0));
console.log(readItem(list, 99));

Apple
(missing)

🚀 Common Use Cases

• Grab the first or second match from querySelectorAll.
• Read a child by position from childNodes.
• Write indexed for loops with early break.
• Teach zero-based indexing for DOM collections.
• Prefer explicit item() in code that mirrors other DOM collection APIs.

🔧 How It Works

📝 Notes

• MDN: Baseline Widely available (since July 2015) — no Deprecated / Experimental / Non-standard banner.
• Zero-based index; out of range returns null.
• No argument → TypeError.
• In JS, list[i] is equivalent for reading.
• Related learning: forEach(), entries(), childNodes, JavaScript hub.

💡 Best Practices