Pourquoi la liste de nœuds n'a-t-elle pas de forEach ?

Question

Je travaillais sur un court script pour changer <abbr> mais a constaté que le texte interne des éléments nodelist n'a pas de forEach méthode. Je sais que nodelist n'hérite pas de Array mais ne semble-t-il pas que forEach serait une méthode utile ? Y a-t-il un problème d'implémentation particulier dont je ne suis pas au courant et qui empêche l'ajout d'une méthode de gestion de l'information dans le système ? forEach a nodelist ?

Note : Je suis conscient que Dojo et jQuery ont tous les deux forEach sous une forme ou une autre pour leurs listes de nœuds. Je ne peux utiliser ni l'un ni l'autre en raison de leurs limitations.

Answer 1

Vous pouvez faire

Array.prototype.forEach.call (nodeList, function (node) {

    // Your code here.

} );

Answer 2

Vous pouvez envisager de créer un nouveau tableau de nœuds.

  var nodeList = document.getElementsByTagName('div'),

      nodes = Array.prototype.slice.call(nodeList,0); 

  // nodes is an array now.
  nodes.forEach(function(node){ 

       // do your stuff here.  

  });

Note : Il s'agit juste d'une liste/réseau de références de nœuds que nous créons ici, pas de nœuds en double.

  nodes[0] === nodeList[0] // will be true

Answer 3

En bref, la mise en œuvre de cette méthode constitue un conflit de conception.

Du MDN :

Pourquoi ne puis-je pas utiliser forEach ou map sur une NodeList ?

Les NodeList sont utilisées comme des tableaux et il serait tentant d'utiliser les méthodes de utiliser les méthodes Array.prototype sur eux. C'est cependant impossible.

JavaScript dispose d'un mécanisme d'héritage basé sur les prototypes. Un tableau héritent des méthodes de tableau (telles que forEach ou map) car leur chaîne de prototypes se présente comme suit chaîne de prototypes ressemble à ce qui suit :

myArray --> Array.prototype --> Object.prototype --> null (la chaîne de prototypes d'un objet peut être obtenue en appelant plusieurs fois Object.getPrototypeOf)

forEach, map et autres sont des propriétés propres à l'objet Array.prototype d'un tableau.

Contrairement aux tableaux, la chaîne de prototypes de NodeList ressemble à ce qui suit :

myNodeList --> NodeList.prototype --> Object.prototype --> null

NodeList.prototype contient la méthode item, mais aucune méthode de type Array.prototype, donc elles ne peuvent pas être utilisées sur les NodeLists.

Fuente: https://developer.mozilla.org/en-US/docs/DOM/NodeList (faire défiler jusqu'à Pourquoi ne puis-je pas utiliser forEach ou map sur une NodeList ? )

Answer 4

Si vous souhaitez utiliser forEach sur NodeList, copiez simplement cette fonction depuis Array :

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

C'est tout, maintenant vous pouvez l'utiliser de la même manière que pour Array :

document.querySelectorAll('td').forEach(function(o){
   o.innerHTML = 'text';
});

Answer 5

NodeList fait partie de l'API DOM. Regardez les liaisons ECMAScript qui s'appliquent également à JavaScript. http://www.w3.org/TR/DOM-Level-2-Core/ecma-script-liaison.html . La nodeList et une propriété de longueur en lecture seule et la fonction item(index) pour retourner un noeud.

La réponse est que vous devez itérer. Il n'y a pas d'alternative. Foreach ne fonctionnera pas. Je travaille avec des liaisons Java DOM API et j'ai le même problème.