Maison > interface Web > js tutoriel > Comment récupérer des éléments par nom de classe en JavaScript ?

Comment récupérer des éléments par nom de classe en JavaScript ?

Mary-Kate Olsen
Libérer: 2024-11-03 02:41:29
original
636 Les gens l'ont consulté

How do I retrieve elements by class name in JavaScript?

Récupération d'éléments par nom de classe

En JavaScript, l'obtention d'un élément par son ID se fait via le document.getElementById("element-id ") méthode. Cependant, lorsque vous tentez d'accéder à un élément par son nom de classe à l'aide de document.getElementByClass("class-name"), une erreur apparaît.

Solution : getElementsByClassName()

La syntaxe correcte pour récupérer les éléments en fonction de leur nom de classe est document.getElementsByClassName("class-name"). Cette méthode renvoie une NodeList contenant tous les éléments partageant la classe spécifiée. Pour accéder à un élément spécifique dans la NodeList, utilisez son index, tel que y[0] pour accéder au premier élément correspondant.

Conversion en tableau

Si vous exigent que la NodeList soit représentée sous forme de tableau, vous pouvez le faire en utilisant Array.prototype.slice.call() method :

var arrFromList = Array.prototype.slice.call(y);
Copier après la connexion

Approches alternatives

Envisagez plutôt d'utiliser les méthodes querySelectorAll('.foo') ou querySelector('.foo'), car elles offrent de meilleures prise en charge du navigateur.

Supplémentaire Considérations

  • Pour des informations précises sur la manipulation du DOM, reportez-vous à MDN plutôt qu'à W3Schools.

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal