7

Could you tell me why we need to use the getPropertyValue method if we can use only the getComputedStyle one?

For example, this will work, as far as I understand:

var s = getComputedStyle(element, null).opacity;

Which is equivalent to the following:

var s = getComputedStyle(element, null).getPropertyValue('opacity');

Can we use getComputedStyle without getPropertyValue?

Oriol
  • 274,082
  • 63
  • 437
  • 513
El cero
  • 607
  • 5
  • 13

2 Answers2

8

According to the old DOM L2 Style, getPropertyValue was not required:

The CSS2Properties interface represents a convenience mechanism for retrieving and setting properties within a CSSStyleDeclaration. The attributes of this interface correspond to all the properties specified in CSS2. Getting an attribute of this interface is equivalent to calling the getPropertyValue method of the CSSStyleDeclaration interface. Setting an attribute of this interface is equivalent to calling the setProperty method of the CSSStyleDeclaration interface.

However, implementations were not required to support it, so using getPropertyValue was safer.

A conformant implementation of the CSS module is not required to implement the CSS2Properties interface.

But according to the newer CSSOM, using camel-case without getPropertyValue must work:

For each CSS property property that is a supported CSS property, the following partial interface applies where camel-cased attribute is obtained by running the CSS property to IDL attribute algorithm for property.

partial interface CSSStyleDeclaration {
    attribute DOMString _camel-cased attribute;
};

The camel-cased attribute attribute, on getting, must return the result of invoking getPropertyValue() with the argument being the result of running the IDL attribute to CSS property algorithm for camel-cased attribute.

Setting the camel-cased attribute attribute must invoke setProperty() with the first argument being the result of running the IDL attribute to CSS property algorithm for camel-cased attribute, as second argument the given value, and no third argument. Any exceptions thrown must be re-thrown.

Therefore, getPropertyValue is no longer necessary to retrieve CSS values.

Oriol
  • 274,082
  • 63
  • 437
  • 513
  • Thank you, Oriol, for your detailed answer. You have removed all my doubts about this subject. Kind regards, Philip. – El cero Jul 28 '15 at 00:11
0

I believe it is for properties that can't be dot-notationed, like background-position. Though I suppose that brings up the question "why not use brackets notation, i.e. getComputedStyle(element, null)['background-position']?". It's possible they just wanted a getter method for the class (CSSStyleDeclaration).

allidoiswin
  • 2,543
  • 1
  • 20
  • 23