Comment sélectionner des éléments contenant des éléments enfants avec des attributs donnés en CSS ?-Questions et réponses sur le réseau chinois PHP

communauté

Apprendre

Bibliothèque d'outils

Outils d'IA

Loisirs

Français

Comment sélectionner des éléments contenant des éléments enfants avec des attributs donnés en CSS ?

P粉170438285

P粉170438285 2023-09-08 18:24:41

0

1

645

J'essaie d'écrire un script utilisateur qui sélectionne un objet avec un attribut [is 的元素的

元素-dismissed] comme enfant direct.

<div> <!-- do not select this -->
    <div> <!-- do not select this -->
        <ytd-rich-grid-media>
        </ytd-rich-grid-media>
    </div>
    <div> <!-- DO select this -->
        <ytd-rich-grid-media is-dismissed>
        </ytd-rich-grid-media>
    </div>
</div>

Les environnements prennent en charge la sélection par attribut ; ce script utilisateur est capable de sélectionner les éléments enfants de l'élément cible :

ytd-rich-grid-media[is-dismissed]  {
    
    display: none !important;
    
}

L'environnement prend également en charge :has() 选择器；该脚本能够选择包含的

(indépendamment des propriétés ou de la profondeur de l'héritage).

div:has(ytd-rich-grid-media) {
    
    display: none !important;
    
}

Enfin, l'environnement supporte > 子选择器；此脚本能够选择

的直接子元素 éléments :

div > ytd-rich-grid-media {
    
    display: none !important;
    
}

Mais lorsque j'essaie de combiner le sélecteur :has() avec n'importe quel autre outil, tout s'effondre. Je veux que le CSS que je recherche ressemble à ceci :

div:has(> ytd-rich-grid-media[is-dismissed] ) {
    
    display: none !important;
    
}

Cependant, cela renvoie une erreur dans Stylus sur Opera. La première erreur est 预期 RPAREN 但发现 '>'。；如果作为诊断步骤删除 >，则第一个错误将改为 Expected RPAREN but found '['.。如果我删除 [is-dismissed], la première erreur est toujours là.

Bien que je ne trouve aucune information indiquant si :has() 是否可以支持具有属性选择器的子项的信息，但我发现了一些资料（包括这个）表明> 选择器应该与 :has() peut prendre en charge les enfants avec des sélecteurs d'attributs, j'ai trouvé certaines sources (y compris celle-ci) qui suggèrent que les sélecteurs > devraient fonctionner correctement avec . Est-ce un bug d'implémentation (dans Opera et/ou Stylus), une combinaison non supportée de sélecteurs CSS (soit dans Opera, soit dans CSS dans son ensemble), un bug de ma part lors de l'assemblage de ces sélecteurs, ou autre chose ? 🎜

P粉170438285

P粉170438285

répondre à tous(1)

P粉404539732

P粉4045397322023-09-09 11:10:04 1 plancher

Cela ressemble plus à un problème d'extension du stylet.

Ce sélecteur est disponible dans Chrome Dev Tools et Autres environnements CSS.

Comme +0

Ajouter une réponse

Sujets populaires

Plus>

Articles populaires

Tutoriels populaires

Plus>

Tutoriels associés

Recommandations populaires

Derniers cours

Derniers téléchargements

Plus>

effets Web

Code source du site Web

Matériel du site Web

Modèle frontal