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