CSSStyleDeclaration

CSSStyleDeclarationインターフェースはCSS宣言ブロックオブジェクトを表し、スタイル情報やスタイル関連のメソッド、プロパティを提供します。

CSSStyleDeclaration オブジェクトは下記の3つのAPIによって使用されます。

  • HTMLElement.style
    DOM要素をインラインスタイルで扱う際。(例, <div style="...">).
  • CSSStyleSheet API。
    例えばdocument.styleSheets[0].cssRules[0].style は、CSSStyleDeclaration を返します。
  • Window.getComputedStyle()
    これは読み取り専用インターフェースとして、CSSStyleDeclaration オブジェクトを返します。

属性

CSSStyleDeclaration.cssText (en-US)
Textual representation of the declaration block. Setting this attribute changes the style.
CSSブロック宣言をテキスト表示する。この属性を与えることでスタイルを変化させることが可能。
CSSStyleDeclaration.length (en-US)読取専用
プロパティの数を表す。後述のitem() (en-US)メソッドを参照のこと。
 
CSSStyleDeclaration.parentRule (en-US)読取専用
CSSRuleを含むコンテナを表す。

CSS プロパティ

CSSStyleDeclaration.cssFloat
float CSSプロパティのエイリアス。
CSSStyleDeclaration named properties
全てのCSSプロパティに対して、その値を取得する。

メソッド

CSSStyleDeclaration.getPropertyPriority() (en-US)
Returns the optional priority, "important".
CSSStyleDeclaration.getPropertyValue()
Returns the property value given a property name.
CSSStyleDeclaration.item() (en-US)
Returns a CSS property name by its index, or the empty string if the index is out-of-bounds.
An alternative to accessing nodeList[i] (which instead returns undefined when i is out-of-bounds). This is mostly useful for non-JavaScript DOM implementations.
CSSStyleDeclaration.removeProperty() (en-US)
Removes a property from the CSS declaration block.
CSSStyleDeclaration.setProperty() (en-US)
Modifies an existing CSS property or creates a new CSS property in the declaration block.
CSSStyleDeclaration.getPropertyCSSValue()  これは廃止された API であり、動作は保証されていません。
Only supported via getComputedStyle in Firefox. Returns the property value as a CSSPrimitiveValue (en-US) or null for shorthand properties.

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);

仕様

仕様 ステータス コメント
CSS Object Model (CSSOM)
CSSStyleDeclaration の定義
草案 Merged the DOM Level 2 Style CSS2Properties interface into CSSStyleDeclaration.
Document Object Model (DOM) Level 2 Style Specification
CSSStyleDeclaration の定義
廃止 Initial definition

ブラウザー実装状況

BCD tables only load in the browser

関連情報