Exemple
Obtenez tous les éléments avec le nom de classe spécifié:
var x =
document.getElementsByClassName("example");
Essayez vous - même » Plus "Try it Yourself" - "Try it Yourself" exemples ci - dessous.
Définition et utilisation
Le getElementsByClassName() méthode retourne une collection de tous les éléments du document avec le nom de classe spécifié, comme un objet NodeList.
L'objet NodeList représente une collection de noeuds. Les nœuds sont accessibles par des numéros d'index. L'indice commence à 0.
Astuce: Vous pouvez utiliser la longueur propriété de l'objet NodeList pour déterminer le nombre d'éléments avec un nom de classe spécifié, vous pouvez boucle à travers tous les éléments et extraire les informations que vous voulez.
Support du navigateur
Les chiffres du tableau indique la première version du navigateur qui prend en charge pleinement la méthode.
| méthode | |||||
|---|---|---|---|---|---|
| getElementsByClassName() | 4.0 | 9.0 | 3.0 | 3.1 | 9.5 |
Syntaxe
document.getElementsByClassName( classname )Les valeurs des paramètres
| Paramètre | Type | La description |
|---|---|---|
| classname | String | Champs obligatoires. Le nom de la classe des éléments que vous souhaitez obtenir. Pour rechercher plusieurs noms de classe, en les séparant par des espaces, comme "test demo" . |
Détails techniques
| DOM Version: | Niveau de base 1 Document Object |
|---|---|
| Valeur de retour: | Un objet NodeList, ce qui représente une collection d'éléments avec le nom de la classe spécifiée. Les éléments de la collection retournés sont classés comme ils apparaissent dans le code source. |
autres exemples
Exemple
Obtenez tous les éléments à la fois le "example" et "color" des classes:
var x =
document.getElementsByClassName("example color"); Essayez vous - même » Exemple
Découvrez comment de nombreux éléments avec class = « exemple » il y a dans le document (en utilisant la propriété de longueur de l'objet NodeList):
var x =
document.getElementsByClassName("example").length; Essayez vous - même » Exemple
Changer la couleur de fond de tous les éléments avec class = « exemple »:
var x = document.getElementsByClassName("example");
var i;
for (i = 0;
i < x.length; i++) {
x[i].style.backgroundColor =
"red";
} Essayez vous - même » Pages associées
Tutoriel CSS: CSS Selectors
CSS Référence: CSS .class Sélecteur
HTML DOM Référence: élément. getElementsByClassName()
HTML DOM Référence: className Property
HTML DOM Référence: classList Property
HTML DOM Référence: Style de l' objet