CSSPseudoElement

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig, bevor Sie diese produktiv verwenden.

Das CSSPseudoElement Interface repräsentiert ein Pseudo-Element, das Ziel eines Ereignisses sein oder mit der Web Animations API animiert werden kann. Instanzen dieses Interfaces können durch Aufrufen von Element.pseudo() erhalten werden.

EventTarget CSSPseudoElement

Instanz-Eigenschaften

CSSPseudoElement.element Experimentell Nur lesbar

Gibt das ursprüngliche/elterliche Element des Pseudo-Elements zurück.

CSSPseudoElement.type Experimentell Nur lesbar

Gibt den Pseudo-Element-Selektor als Zeichenfolge zurück.

Instanz-Methoden

CSSPseudoElement erweitert EventTarget, sodass es die folgenden Methoden erbt:

Beispiele

Einfaches Beispiel mit Element.pseudo

Mithilfe von Pseudo-Elementen fügen die meisten modernen Browser automatisch Anführungszeichen um den Text innerhalb eines <q>-Elements hinzu. (In älteren Browsern kann eine Stilregel erforderlich sein, um Anführungszeichen hinzuzufügen.) Das untenstehende Beispiel zeigt die grundlegenden Eigenschaften des CSSPseudoElement-Objekts, das das öffnende Anführungszeichen repräsentiert.

js
const element = document.querySelector("q");
const cssPseudoElement = element.pseudo("::before");
console.log(cssPseudoElement.element); // Outputs [object HTMLQuoteElement]
console.log(cssPseudoElement.type); // Outputs '::before'

Spezifikationen

Specification
CSS Pseudo-Elements Module Level 4
# CSSPseudoElement-interface

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch