Comment puis-je interroger des éléments Div avec plusieurs noms de classe ?

Interrogation d'éléments Div par plusieurs noms de classe

Dans le scénario où un élément Web a plusieurs noms de classe, la requête utilisant className avec espace- les valeurs séparées sont irréalisables en raison de leurs fonctionnalités limitées. Pour résoudre ce problème, plusieurs approches alternatives sont disponibles.

Localisateurs XPath :

XPath permet l'utilisation de plusieurs critères dans l'identification des éléments. Par exemple, l'expression suivante fera correspondre les éléments avec les classes « valeur » et « test » :

//div[contains(@class, 'value') and contains(@class, 'test')]

Sélecteurs CSS :

Les sélecteurs CSS offrent un aperçu concis et alternative efficace. Le caractère "*" peut être utilisé pour faire correspondre n'importe quelle valeur dans un nom de classe.

div[class*='value test']

Dans les cas où l'ordre des classes spécifiées n'a pas d'importance, le sélecteur suivant peut être utilisé :

div.value.test

Implémentations personnalisées :

Pour les requêtes plus complexes, des implémentations personnalisées utilisant JavaScript ou des API de navigateur peuvent être nécessaire.

Exemples :

Considérez la structure HTML suivante :

<div class="value test"></div>
<div class="value test     "></div>
<div class="first value test last"></div>
<div class="test value"></div>

Le tableau suivant illustre comment les différentes approches correspondraient à ces éléments :

Approach	Matching Elements
By.xpath("//div[@class='value test']")	1
By.xpath("//div[contains(@class, 'value test')]")	1, 2, 3
By.cssSelector("div[class='value test']")	1
By.cssSelector("div[class*='value test']")	1, 2, 3
By.cssSelector("div.value.test")	1, 2, 3, 4

En sélectionnant l'approche la plus appropriée pour les besoins spécifiques d'identification des éléments, les développeurs peuvent localiser efficacement les éléments Web avec plusieurs classes noms.

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!