Pouvez-vous sélectionner des éléments par valeurs d'identification partielles avec CSS ?

Sélection d'éléments par valeur d'identification partielle avec CSS

Dans le domaine du CSS, l'identification des éléments avec précision est primordiale. Cette question explore la possibilité de sélectionner des éléments non pas par leur valeur d'ID complète mais plutôt par une correspondance partielle.

Éléments générés par PHP avec des ID incomplets

Le problème vient des éléments générés par PHP avec valeurs d'identification partielles. Par exemple :

<div class="1" id="as_1"> ... </div>
<div class="2" id="bs_1"> ... </div>

<div class="1" id="as_2"> ... </div>
<div class="2" id="bs_2"> ... </div>

Alors que l'attribut de classe regroupe les éléments par points communs, la nécessité de les sélectionner individuellement pose un défi en raison des noms d'ID incomplets.

Correspondance d'ID partielle avec CSS

Malheureusement, les sélecteurs d'ID CSS exigent des valeurs d'ID complètes, ce qui rend les suggestions telles que #as_{ ... } et #bs_{ ... } inefficaces.

Sélecteurs de sous-chaîne d'attribut : une alternative

Les sélecteurs de sous-chaîne d'attribut offrent une approche alternative :

div[id^="as_"]
div[id^="bs_"]

Ces sélecteurs correspondent aux éléments dont les valeurs d'ID commencent par la chaîne spécifiée. Cependant, s'appuyer sur cette méthode peut entraîner des conséquences inattendues si d'autres éléments partagent des préfixes similaires dans leurs identifiants.

Une solution pratique utilisant des classes

Étant donné la présence d'un attribut de classe, une solution plus simple implique attribuer une classe commune à chaque groupe d'éléments et les cibler via CSS via cette classe. La désignation de classe pourrait être dérivée de la logique PHP responsable de la génération des identifiants. Cette approche simplifie le processus de sélection tout en conservant la spécificité souhaitée.

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!