CSSMathValue

The CSSMathValue interface of the CSS_Object_Model#css_typed_object_model a base class for classes representing complex numeric values.

Below is a list of interfaces based on the CSSMathValue interface.

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

CSSMathValue.operator

Indicates the operator that the current subtype represents.

No

None.

We create an element with a width determined using a calc() function, then console.log() the operator.

<div>has width</div>

We assign a width with a calculation

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

We add the JavaScript

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

The CSSMathValue.operator returns 'sum' because styleMap.get('width').values[1].value ); is -20: adding a negative number.