Recherche d'un élément DOM avec une partie d'attribut avec la vanille Javascript - javascript, html, arrays, dom

Disons que j'ai un site web et que je veux utiliserscript qui parcourt ses éléments DOM et souligne ces éléments qui attribuent une partie du texte spécifié. J'ai réussi à créer une boucle simple qui trouve chaque attribut souhaité de l'élément DOM et en crée un tableau. Je souhaite maintenant associer la valeur de mon attribut de tableau à l'élément DOM auquel il appartient et aussi pouvoir trouver la partie de texte spécifiée qui correspond à l'élément de tableau (attribut) et à l'élément DOM.

var getAll = document.getElementsByTagName("*");
var myArray = [];

for (var i=0; i<getAll.length; i++) {
getHref = getAll[i].getAttribute("href");
if (getHref !== null) {
myArray.push(getHref);
}
}

Je ne sais pas comment lier mes attributs avec DOMéléments. J'ai essayé d'utiliser indexOf ("") pour trouver une partie du texte, mais cela ne fonctionne pas car il recherche des chaînes complètes dans un tableau. Quelqu'un serait-il si gentil et m'aiderait-il? Je ne veux utiliser aucun cadre.

Réponses:

Maintenant, je veux associer ma valeur d'attribut de tableau avec l'élément DOM qu'il appartient à et aussi être capable de trouver la partie spécifiée du texte qui correspond à l'élément de tableau (attribut) et à l'élément DOM.

Pourquoi ne pas simplement obtenir que les éléments qui correspondent à l'aide de la contient sélecteur

var getAll = document.querySelectorAll("[href*="text-to-be-matched"]");

C'est un NodeList avec lequel vous pouvez parcourir pour-boucle et indexez les éléments DOM avec ce que vous avez trouvé.

var attributeValToDOMMap = {};
getAll.forEach( function( element ){
var hrefVal = element.getAttribute( "href" );
attributeValToDOMMap[ hrefVal ] =  attributeValToDOMMap[ hrefVal ] || []; //in case one href value is common with multiple DOM elements
attributeValToDOMMap[ hrefVal ].push( element );
});

Vous voulez filtrer un attribut href par un texte?

Vous pouvez utiliser .indexOf(), Je ne vois pas de raison pourquoi pas.

Ou vous pouvez améliorer votre sélecteur au début (mais cela a déjà été suggéré).

Voici le violon montrant 1 ligne de code ajoutée à la vôtre afin de filtrer certaines chaînes apparaissant dans href.

violon