Questions tagged [nodelist]

The NodeList interface provides the abstraction of an ordered collection of nodes, without defining or constraining how this collection is implemented. NodeList objects in the DOM are live. The items in the NodeList are accessible via an integral index, starting from 0.

Summary

NodeList objects are collections of nodes returned by getElementsByTagName, getElementsByTagNameNS, Node.childNodes, querySelectorAll, getElementsByClassName, etc.

Properties

length

Reflects the number of elements in the NodeList.

Methods

item ( idx )

Returns an item in the list by its index, or null if out-of-bounds. Equivalent to nodeList[idx]

Description

A "live" collection

In most cases, the NodeList is a live collection. This means that changes on the DOM tree are going to be reflected on the collection.

var links = document.getElementsByTagName('a');
// links.length === 2 for instance.
document.body.appendChild( links[0].cloneNode(true) ); // another link is added to the document
// the 'links' NodeList is automatically updated
// links.length === 3 now.

If the NodeList is the return value of document.querySelectorAll, it is NOT live.

383 questions
283
votes
14 answers

Fastest way to convert JavaScript NodeList to Array?

Previously answered questions here said that this was the fastest way: //nl is a NodeList var arr = Array.prototype.slice.call(nl); In benchmarking on my browser I have found that it is more than 3 times slower than this: var arr = []; for(var i =…
jairajs89
  • 3,725
  • 3
  • 16
  • 14
148
votes
12 answers

What does [].forEach.call() do in JavaScript?

I was looking at some snippets of code, and I found multiple elements calling a function over a node list with a forEach applied to an empty array. For example I have something like: [].forEach.call( document.querySelectorAll('a'), function(el) { …
Mimo
  • 5,707
  • 5
  • 33
  • 45
107
votes
4 answers

Filter or map nodelists in ES6

What is the most efficient way to filter or map a nodelist in ES6? Based on my readings, I would use one of the following options: [...nodelist].filter or Array.from(nodelist).filter Which one would you recommend? And are there better ways, for…
Christophe
  • 24,147
  • 23
  • 84
  • 130
69
votes
2 answers

When is NodeList live and when is it static?

From MDN for NodeList: In some cases, the NodeList is a live collection, which means that changes in the DOM are reflected in the collection. For example, Node.childNodes is live: var parent = document.getElementById('parent'); var…
temporary_user_name
  • 30,801
  • 41
  • 120
  • 186
43
votes
8 answers

NodeList object in javascript

Can anyone tell me what kind of object the NodeList is. I read that it is an array-like object and that it can be accessed via bracket notation, for example var a = someNode.childNode[0];. How is this possible since via bracket notation we can only…
ppoliani
  • 4,266
  • 2
  • 30
  • 58
36
votes
4 answers

How can I convert an Array of nodes to a static NodeList?

NOTE: Before this question is assumed a duplicate, there is a section at the bottom of this question that addresses why a few similar questions do not provide the answer I am looking for. We all know that it is easy to convert a NodeList to an…
KevBot
  • 14,556
  • 3
  • 37
  • 59
36
votes
8 answers

addEventListener on NodeList

Does NodeList support addEventListener. If not what is the best way to add EventListener to all the nodes of the NodeList. Currently I am using the code snippet as show below, is there a better way to do this. var ar_coins =…
Dinesh P.R.
  • 5,870
  • 5
  • 32
  • 44
27
votes
11 answers

JavaScript NodeList

is there a way to join 2 NodeLists returned by 2 calls of document.getElementsByTagName? Say, I have the following code var inputs = documentElement.getElementsByTagName('input'); var selects = document.getElementsByTagName('select'); I want to…
Dasha Salo
  • 5,139
  • 5
  • 24
  • 28
22
votes
6 answers

Typescript,'NodeListOf' is not an array type or a string type

Converting my JS to TS strict mode. The following syntax looks fine to me but TS is complaining in the for loop on allSubMenus with: [ts] Type 'NodeListOf' is not an array type or a string type. What am I missing? function…
Sam
  • 1,049
  • 2
  • 11
  • 35
22
votes
1 answer

Find elements in a Node without the proper namespace, in Java

So I have a xml doc that I've declared here: DocumentBuilder dBuilder = dbFactory_.newDocumentBuilder(); StringReader reader = new StringReader(s); InputSource inputSource = new InputSource(reader); doc_ = dBuilder.parse(inputSource); Then I have a…
Grammin
  • 10,772
  • 22
  • 72
  • 132
22
votes
4 answers

Are HTMLCollection and NodeList iterables?

In ES6, an iterable is an object that allows for... of, and has a Symbol.iterator key. Arrays are iterables, as are Sets and Maps. The question is: are HTMLCollection and NodeList iterables? Are they supposed to be? MDN documentation seems to…
light
  • 3,780
  • 2
  • 18
  • 37
19
votes
6 answers

Speeding up xpath

I have a 1000 entry document whose format is something like: There are more…
jon
  • 801
  • 2
  • 9
  • 9
18
votes
2 answers

JavaScript iterate through NodeList

I am looking for a best way to iterate through NodeList excluding length. I am using: var foo = document.querySelectorAll('[id^=foo_id]') console.log(foo) Returned NodeList has all the required elements + the last entry of length:. 0:…
goryef
  • 663
  • 1
  • 8
  • 25
18
votes
6 answers

Javascript - Concatenate Multiple NodeLists Together

I was originally asking for an elegant way to simulate the Array.concat() functionality on the results of the getElementsByTagName function in IE or older browsers, because it seemed that concat was not supported. Only, of course it is--the reason…
ErikE
  • 43,574
  • 19
  • 137
  • 181
17
votes
4 answers

NodeList.prototype.forEach = Array.prototype.forEach;

Do you see any problems with the following: NodeList.prototype.forEach = Array.prototype.forEach; Normally forEach is just a property of arrays, but by setting it as a property of all NodeLists as well, there's no need to convert a NodeList to an…
Web_Designer
  • 64,966
  • 87
  • 197
  • 254
1
2 3
25 26