Pourquoi « document.getElementsByClassName().forEach » ne fonctionne-t-il pas et comment puis-je y remédier ?

Utilisation de Array.forEach avec getElementsByClassName

Lorsque vous tentez de parcourir des éléments DOM à l'aide de document.getElementsByClassName( "myclass" ).forEach, un peut rencontrer l'erreur "document.getElementsByClassName("myclass").forEach n'est pas une fonction." Cela se produit car le résultat de getElementsByClassName n'est pas un tableau mais une HTMLCollection.

Pour résoudre ce problème, il faut convertir la HTMLCollection en tableau avant d'utiliser forEach. Cela peut être fait en utilisant la méthode Array.prototype.forEach.call avec HTMLCollection comme valeur this :

var els = document.getElementsByClassName("myclass");
Array.prototype.forEach.call(els, function(el) {
    // Do stuff here
    console.log(el.tagName);
});

Alternativement, on peut utiliser [].forEach.call:

[].forEach.call(els, function (el) {...});

Dans ES6, la fonction Array.from peut être utilisée :

Array.from(els).forEach((el) => {
    // Do stuff here
    console.log(el.tagName);
});

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!