Maison  >  Article  >  interface Web  >  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
Linda Hamiltonoriginal
2024-11-02 12:09:02944parcourir

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>

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>

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!

Déclaration:
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