Summary

CSSStyleDeclaration represents a collection of CSS property-value pairs. It is used in a few APIs:

The declaration block is that part of the style rule that appears within the braces and that actually provides the style definitions (for the selector, the part that comes before the braces).

Attributes

CSSStyleDeclaration.cssText
Textual representation of the declaration block. Setting this attribute changes the style.
CSSStyleDeclaration.length Read only
The number of properties. See the item() method below.
CSSStyleDeclaration.parentRule Read only
The containing CSSRule.

Methods

CSSStyleDeclaration.getPropertyPriority()
Returns the optional priority, "important".
CSSStyleDeclaration.getPropertyValue()
Returns the property value given a property name.
CSSStyleDeclaration.item()
Returns a property name.
CSSStyleDeclaration.removeProperty()
Removes a property from the CSS declaration block.
CSSStyleDeclaration.setProperty()
Modifies an existing CSS property or creates a new CSS property in the declaration block/.
CSSStyleDeclaration.getPropertyCSSValue()
Only supported via getComputedStyle in Firefox. Returns the property value as a CSSPrimitiveValue or null for shorthand properties.

Example

var styleObj = document.styleSheets[0].cssRules[0].style;
console.log(styleObj.cssText);

for (var i = styleObj.length; i--;) {
  var nameString = styleObj[i];
  styleObj.removeProperty(nameString);
}

console.log(styleObj.cssText);

Specifications

Specification Status Comment
CSS Object Model (CSSOM)
The definition of 'CSSStyleDeclaration' in that specification.
Working Draft  
Document Object Model (DOM) Level 2 Style Specification
The definition of 'CSSStyleDeclaration' in that specification.
Obsolete Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support1 ?1 ? Yes ?
cssText Yes ? Yes ? Yes ?
length Yes Yes Yes Yes Yes Yes
item Yes Yes Yes Yes Yes Yes
getPropertyValue Yes Yes Yes Yes Yes Yes
getPropertyCSSValue Yes — 411 No Yes — 622 No15 — 281 Yes
getPropertyPriority Yes Yes Yes Yes Yes Yes
setProperty Yes Yes Yes Yes Yes Yes
removeProperty Yes Yes Yes Yes Yes Yes
parentRule Yes Yes Yes Yes Yes Yes
cssFloat Yes ? No ? Yes ?
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support Yes Yes ?4 Yes ? ?
cssText Yes Yes ? Yes Yes ? ?
length Yes Yes Yes Yes Yes Yes ?
item Yes Yes Yes Yes Yes Yes ?
getPropertyValue Yes Yes Yes Yes Yes Yes ?
getPropertyCSSValue Yes Yes — 411 No Yes15 — 281 Yes ?
getPropertyPriority Yes Yes Yes Yes Yes Yes ?
setProperty Yes Yes Yes Yes Yes Yes ?
removeProperty Yes Yes Yes Yes Yes Yes ?
parentRule Yes Yes Yes Yes Yes Yes ?
cssFloat Yes Yes ? No Yes ? ?

1. See bug 331608.

2. Only returns a result if called on the result of getComputedStyle().

See also

Document Tags and Contributors

Last updated by: connorshea,