Maison > interface Web > js tutoriel > le corps du texte

Comment sélectionner des éléments avec des ID en double à l'aide de jQuery lorsque HTML nécessite des ID uniques ?

Patricia Arquette
Libérer: 2024-10-30 10:33:26
original
509 Les gens l'ont consulté

How do you select elements with duplicate IDs using jQuery when HTML requires unique IDs?

Sélection d'éléments avec des identifiants en double à l'aide de jQuery

En HTML, les identifiants sont censés être des identifiants uniques pour les éléments. Cependant, il existe des scénarios dans lesquels plusieurs éléments peuvent avoir le même ID. Bien que cela ne soit pas considéré comme du HTML valide, on le rencontre parfois dans les bases de code existantes ou dans les solutions tierces. jQuery propose deux options pour gérer de telles situations.

Option 1 : Utilisation du sélecteur d'identifiant unique

S'il n'est pas possible de modifier les identifiants en double, vous pouvez utiliser ce qui suit solution de contournement pour sélectionner des éléments avec le même attribut ID :

jQuery(document).ready(function() {
    jQuery('[id=carousel]').jcarousel();
});
Copier après la connexion

Ce sélecteur correspondra à tous les éléments qui ont un attribut avec le nom « id » et une valeur de « carrousel ». Notez que cette approche n'est pas recommandée, car elle peut introduire des problèmes de spécificité et de manipulation du DOM.

Option 2 : Utiliser un nom de classe commun

L'approche recommandée consiste à attribuez un nom de classe commun à tous les éléments qui doivent partager des fonctionnalités. Cela garantit que la sélection est basée sur une classe, qui n'est pas limitée par l'exigence d'unicité des identifiants.

jQuery(document).ready(function() { 
    jQuery('.carousel').jcarousel();
});
Copier après la connexion

Dans le code HTML fourni, vous pouvez modifier l'ID du deuxième carrousel en une valeur unique. ou donnez aux deux carrousels un nom de classe commun. Cela permettra à jQuery d'appliquer correctement le plugin 'jcarousel' aux deux éléments.

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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!