Element.getElementsByClassName()
La méthode Element.getElementsByClassName()
retourne une HTMLCollection
contenant une référence sur tous les éléments ayant les noms de classes passés en paramètre. Quand la méthode est appelée sur l'objet document, la recherche s'effectue dans le document complet, noeud racine compris.
À l'instar de la méthode Document.getElementsByClassName()
qui agit sur le document entier ; elle va retourner les descendants de l'élément spécifié comme document root qui auront les noms de classes passés en paramètre.
Syntaxe
var elements = element.getElementsByClassName(names);
- elements est une
HTMLCollection
de référence vers les élements trouvés. - names est une chaine représentant la liste des noms de classes à trouver; les noms de classes sont séparés par un espace.
- element est n'importe quel
Element
du document.
Exemples
Obtient tous les élements ayant une classe test
:
element.getElementsByClassName("test");
Obtient tous les élements ayant à la fois la classe red
et la classe test
:
element.getElementsByClassName("red test");
Obtient tous les élements qui ont une classe test
, à l'intérieur d'un élement qui a pour id main
:
document.getElementById("main").getElementsByClassName("test");
On peut aussi utiliser les méthodes de Array.prototype
sur chaque HTMLCollection
en passant la HTMLCollection
comme valeur this de la méthode. Ci-dessous on trouvera tous les <div>
avec une classe test
:
var testElements = document.getElementsByClassName("test");
var testDivs = Array.prototype.filter.call(
testElements,
function (testElement) {
return testElement.nodeName === "div";
},
);
Spécifications
Specification |
---|
DOM Standard # ref-for-dom-element-getelementsbyclassname |
Compatibilité des navigateurs
BCD tables only load in the browser