Je crée un bouton que je devrais mettre en évidence certains mots dans une classe spécifiée, mais j'ai des problèmes avec le retour de tous les éléments de la classe. Cela ne fonctionnera que si je spécifie un index, donc je suppose qu'il peut y avoir quelque chose de mal avec la "boucle" existante. Toute aide est appréciée!
Cela fonctionnera, mais seulement "met en évidence" le premier élément de la classe, bien sûr: Cela ne fonctionnera pas du tout: < / p>
3 Réponses :
Vous ne pouvez pas accéder à car il est écrit en anglais clair: avec un signifie qu'il s'agit d'un tableau (un type HTMLCollection ) innerhtml dans quelque chose qui renvoie un htmlCollection getelementsbyclassname < / code>. pluriel . "éléments" . "s" à la fin ...
Comme vous pouvez le voir getelementsbyclassname est pluralisé (éléments). En effet, une même classe peut être affectée à plusieurs éléments HTML. Vous ne trouverez aucun moyen de télécharger le [0] et vous ne devriez pas quand même signifier que vous obtenez des données du mauvais nœud. Si vous avez besoin de données d'un élément spécifique que vous pouvez vous assurer est unique, vous devez lui donner un identifiant et utiliser getElementyid à la place.
Si vous souhaitez remplacer plusieurs mots dans plusieurs éléments, vous avez besoin de deux boucles:
const testElements = document.getElementsByClassName('test');
for (const element of testElements) {
for (const search of searchArray) {
element.innerHTML = doHighlight(element.innerHTML, search, highlightStartTag, highlightEndTag);
}
}
Cela fonctionne comme un rêve. D'autres commentaires, je me rends compte que je n'étais pas assez clair dans mon explication, mais vous avez lu mon esprit! C'est exactement ce que j'avais manqué.
Puisque nous n'avons aucune idée de ce que
DoHighighlight est-il un peu difficile d'aider, mais le problème est généralement, le fait quegetelementsbyclassname renvoie une collection et vous devez l'utiliser avec une boucle