javascript - How to Loop through all nodeValues in DOM in JS

Question

I am trying to loop through and increment the following:

var result_types = document.querySelectorAll('[data-title]')[0].attributes[2].nodeValue

specifically to grab and increment this value:

[0].attributes

Currently, I have the following:

var card = document.querySelectorAll('[data-title]')[0].attributes[2].nodeValue;
  for (var i = 0; i < card.length; i++) {
  console.log(card[i]);
  }

I am trying to get this [0].attributes to increment to [1].attributes etc. when it is clicked

question from:https://stackoverflow.com/questions/65891418/how-to-loop-through-all-nodevalues-in-dom-in-js

Answer 1

I am not sure what you are asking here, but if the issue is looping through the elements, this is happening because you get a NodeList back from querySelectorAll and not an array. Below will let you loop through node elements.

const nodes = document.querySelectorAll('.nodes');

[].forEach.call(nodes, (singleNode) => {
    //Whatever you want.
})