Maison > interface Web > js tutoriel > Comment puis-je localiser les éléments DOM par valeur d'attribut à l'aide des API natives et de jQuery ?

Comment puis-je localiser les éléments DOM par valeur d'attribut à l'aide des API natives et de jQuery ?

Patricia Arquette
Libérer: 2024-12-07 08:42:14
original
739 Les gens l'ont consulté

How Can I Locate DOM Elements by Attribute Value Using Native APIs and jQuery?

API DOM pour localiser des éléments par valeur d'attribut

Souvent, il est nécessaire de trouver un élément dans le DOM en fonction de ses attributs. Par exemple, vous souhaiterez peut-être récupérer tous les éléments avec une classe ou un attribut de données spécifique.

API native : querySelectorAll

Les navigateurs modernes fournissent une API native, querySelectorAll, qui vous permet de rechercher des éléments en fonction de leurs attributs. Cette méthode prend comme argument un sélecteur CSS, qui peut inclure des sélecteurs d'attributs. Par exemple :

document.querySelectorAll('[data-foo="value"]');
Copier après la connexion

Compatibilité des navigateurs

La méthode querySelectorAll est prise en charge par la plupart des navigateurs modernes, y compris :

  • Chrome
  • Firefox
  • Safari
  • Edge
  • IE11 et supérieur

Pour les navigateurs obsolètes, tels que IE9 et versions antérieures, vous pouvez utiliser un polyfill ou bibliothèque tierce comme jQuery.

Approche jQuery

jQuery simplifie cette tâche en fournissant une syntaxe concise :

$('[data-foo="value"]');
Copier après la connexion

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