Wie wähle ich Elemente aus, die untergeordnete Elemente mit bestimmten Attributen in CSS enthalten?-Fragen und Antworten zum chinesischen PHP-Netzwerk

Gemeinschaft Lernen Tools-Bibliothek Freizeit

Deutsch

Wie wähle ich Elemente aus, die untergeordnete Elemente mit bestimmten Attributen in CSS enthalten?

P粉170438285

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

0

1

603

Ich versuche, ein Benutzerskript zu schreiben, das ein Objekt mit einem [is 的元素的

元素-dismissed]-Attribut als direktes untergeordnetes Objekt auswählt.

<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>

Umgebungen unterstützen die Auswahl nach Attribut; dieses Benutzerskript kann untergeordnete Elemente des Zielelements auswählen:

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

Die Umgebung unterstützt auch :has() 选择器；该脚本能够选择包含的

(unabhängig von Eigenschaften oder Vererbungstiefe).

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

Schließlich unterstützt die Umgebung > 子选择器；此脚本能够选择

的直接子元素 Elemente:

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

Aber wenn ich versuche, den :has()-Selektor mit einem anderen Werkzeug zu kombinieren, fällt alles auseinander. Ich möchte, dass das gesuchte CSS so aussieht:

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

Allerdings gibt dies einen Fehler in Stylus on Opera zurück. Der erste Fehler ist 预期 RPAREN 但发现 '>'。；如果作为诊断步骤删除 >，则第一个错误将改为 Expected RPAREN but found '['.。如果我删除 [is-dismissed], der erste Fehler ist immer noch da.

Obwohl ich keine Informationen darüber finden kann, ob :has() 是否可以支持具有属性选择器的子项的信息，但我发现了一些资料（包括这个）表明> 选择器应该与 :has() Kinder mit Attributselektoren unterstützen kann, habe ich einige Quellen (einschließlich dieser) gefunden, die darauf hinweisen, dass >-Selektoren gut mit funktionieren sollten. Ist das ein Implementierungsfehler (in Opera und/oder Stylus), eine nicht unterstützte Kombination von CSS-Selektoren (entweder in Opera oder in CSS insgesamt), ein Fehler meinerseits beim Zusammenstellen dieser Selektoren oder etwas anderes? 🎜

P粉170438285

P粉170438285

Antworte allen(1)

P粉404539732

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

看起来更像是手写笔扩展的问题。

该选择器在 Chrome 开发工具和其他 CSS 环境。

Wie +0

Antwort hinzufügen

Beliebte Themen

Mehr>

Populäre Artikel

Beliebte Tutorials

Mehr>

Verwandte Tutorials

Beliebte Empfehlungen

Aktuelle Kurse

最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)

1421054
php入门教程之一周学会PHP

4264602
JAVA 初级入门视频教程

2514303

Neueste Downloads

Mehr>

Web-Effekte

Quellcode der Website

Website-Materialien

Frontend-Vorlage