forEach qui ne passe pas

Bonjour.
Je souhaite boucler sur une NodeList. Avec la boucle for en commentaire, ça fonctionne parfaitement, avec le forEach non ...
j'obtiens le message d'erreur :

Citation:

---

Uncaught TypeError: puce2.forEach is not a function

---

Code:

---

1 2 3 4 5 6

puce2 = liste1[i].getElementsByTagName("dd"); puce2.forEach(function(e) {e.style = "background : cyan";}); /*for (k = 0; k < puce2.length; k++) {   puce2[k].style = "background : lightcyan";   }*/ }

---

J'ai pourtant l'impression d'avoir codé correctement : https://www.w3schools.com/jsref/met_...st_foreach.asp

e = event ..

https://jsfiddle.net/14jLvzrm/

oui, bien sûr ...
Cette 1° erreur étant réparée, j'obtiens pourtant la même erreur.
J'ai copié-collé ton code à un autre endroit du script avec la même erreur :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

xx = document.getElementsByTagName("table")[0].getElementsByTagName("tr");   xx.forEach( function(elt){ console.log(elt); elt.style.backgroundColor="cyan"; }); // xx.forEach(function(elt) {elt.style="background : lightcyan";}); /* for (i = 1; i < x.length; i++) {   xx[i].style = "background : lightcyan"; };*/

---

La boucle for commentée fonctionne mais pas le forEach

Fait peter le source du html correspondant que je puisse tester ...

Curieusement il semble que getElementsByName retourne un nodeList
Alors que getElementByTagName retourne une collection HTML
https://jsfiddle.net/d82e9ts0/

Pièce jointe 636095

Citation:

---

Envoyé par SpaceFrog

Curieusement il semble que getElementsByName retourne un nodeList
Alors que getElementByTagName retourne une collection HTML
https://jsfiddle.net/d82e9ts0/

---

C'est surement ça !
Du coup, le forEach ne passe pas sur une collection ...

Une solution est de passer par un Array :

Code:

---

1 2 3 4 5 6 7

xxx= Array.from(document.getElementsByTagName("tr")); console.log(xxx); xxx.forEach( function(elt){ console.log(elt); elt.style.backgroundColor="cyan"; });

---

ce qui convertit ta collection HTML en array sur lequel tu peux alors appliquer le forEach

Merci ! c'est parfait!

:hola:

Une autre solution à mon avos meilleure est d'utiliser querySelectorAll :

Code:

---

x= document.getElementsByTagName("table")[0].querySelectorAll("tr");

---

qui du coup te retourne un NodeList qui accepte le forEach

Bonjour,

Citation:

---

Envoyé par SpaceFrog

Curieusement il semble que getElementsByName retourne un nodeList
Alors que getElementByTagName retourne une collection HTML

---

Tout à fait et une HTMLCollection n'est pas itérable, j'avais expliqué cela dans cette discussion

Citation:

---

Envoyé par SpaceFrog

Une solution est de passer par un Array

---

une écriture moderne serait

Code:

---

const arrayCollection = [... document.getElementsByTagName("tr")];

---

par contre pour un élément <table> on peut récupérer directement les <tr> via la propriété rows qui est une HTMLCollection !

Oui je sais je ne sui pas moderne ... C'est l'age que voulez vous :mrgreen:

Mais bon querySelectorAll me semble la bonne solution ...