Maison > interface Web > js tutoriel > Comment sélectionner des éléments par nom de classe en JavaScript ?

Comment sélectionner des éléments par nom de classe en JavaScript ?

Linda Hamilton
Libérer: 2024-11-02 12:09:02
original
1048 Les gens l'ont consulté

How do I Select Elements by Class Name in JavaScript?

Comment obtenir des éléments par nom de classe

En JavaScript, récupérer des éléments par leurs identifiants est simple à l'aide de la méthode document.getElementById(). Cependant, l'obtention d'éléments par classe est légèrement différente et peut initialement prêter à confusion.

Le nom correct de la méthode pour sélectionner des éléments par classe est document.getElementsByClassName(). En effet, plusieurs éléments d'une page Web peuvent partager la même classe, d'où l'utilisation de « Elements », qui renvoie une NodeList ou un objet de type tableau.

Voici un exemple :

<code class="javascript">var elementsByClass = document.getElementsByClassName('class_name');
console.log(elementsByClass[0]); // Accesses the first element with the provided class name</code>
Copier après la connexion

Si vous devez convertir la NodeList en un tableau réel, vous pouvez utiliser les méthodes suivantes :

<code class="javascript">var arrayFromList1 = Array.prototype.slice.call(elementsByClass);

// Alternatively, you can use the following syntax to convert the NodeList to an array
var arrayFromList2 = [].slice.call(elementsByClass);</code>
Copier après la connexion

Il convient de noter que l'utilisation de querySelector() ou querySelectorAll() pour sélectionner des éléments par classe est généralement préféré en raison d'une meilleure prise en charge entre navigateurs.

Enfin, il est recommandé de se référer à des sources réputées comme MDN pour des informations JavaScript précises et à jour.

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!

source:php.cn
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