DOM - NodeList (Collection)

> (World Wide) Web - (W3|WWW) > The Document Object Model W3C API Interface (DOM)

1 - About

A nodelist is the result of a selection that returns more than one node (Generally an element)

Nodelist:

  • HTMLAllCollection, HTMLFormControlsCollection, HTMLOptionsCollection, interfaces are collections derived from the HTMLCollection interface.
Advertising

3 - Loop - Example

  • A list of div element where we want to loop.
<div>Nico</div>
<div>can</div>
<div>do</div>
<div>JS</div>
  • The Javascript code that shows the loop.
// Get all divs element
// allDivs is an array of NodeList
allDivs=document.querySelectorAll("div");
 
// If not null
if (allDivs !=null ) {
    // length of the array
    var length = 4 ; 
    // normally you will use - length = allDivs.length
    // but the 'console.log' of the webcode plugin use a div to render that we don't want
    // therefore we give the number of element
    for (i = 0; i < length; i++) {
        console.log("Div element number "+i+" - "+allDivs[i].textContent);
    }
}

4 - Documentation / Reference

web/dom/nodelist.txt ยท Last modified: 2019/02/09 11:41 by gerardnico