CSSMathValue

Nachfolgend ist eine Liste von Schnittstellen basierend auf der CSSMathValue-Schnittstelle.

• CSSMathInvert
• CSSMathMax
• CSSMathMin
• CSSMathNegate
• CSSMathProduct
• CSSMathSum

CSSMathValue.operator

Gibt den Operator an, den der aktuelle Subtyp repräsentiert.

Die Schnittstelle kann auch Methoden von ihrer Elternschnittstelle, CSSNumericValue, erben.

Die Schnittstelle kann auch Methoden von ihrer Elternschnittstelle, CSSNumericValue, erben.

Wir erstellen ein Element mit einer width, die mit einer calc() Funktion bestimmt wird, und verwenden dann console.log(), um den operator zu loggen.

<div>has width</div>

Wir weisen ein width mit einer Berechnung zu

div {
  width: calc(30% - 20px);
}

Wir fügen das JavaScript hinzu

const styleMap = document.querySelector("div").computedStyleMap();

console.log(styleMap.get("width")); // CSSMathSum {values: CSSNumericArray, operator: "sum"}
console.log(styleMap.get("width").operator); // 'sum'
console.log(styleMap.get("width").values[1].value); // -20

Der CSSMathValue.operator gibt "sum" zurück, weil styleMap.get("width").values[1].value ); -20 ist: Das Hinzufügen einer negativen Zahl.