CSSStyleDeclaration

CSSStyleDeclaration 接口表示一个 CSS 声明块对象，并公开样式信息以及各种与样式相关的方法和属性。

可以通过三种不同的 API 公开 CSSStyleDeclaration 对象

通过 HTMLElement.style，它处理单个元素的内联样式（例如，<div style="…">）。
通过 CSSStyleSheet API。例如，document.styleSheets[0].cssRules[0].style 返回文档第一个样式表中第一个 CSS 规则的 CSSStyleDeclaration 对象。
通过 Window.getComputedStyle()，它将 CSSStyleDeclaration 对象公开为只读接口。

属性

CSSStyleDeclaration.cssText: 声明块的文本表示形式，当且仅当它通过 HTMLElement.style 公开时。设置此属性会更改内联样式。如果您想要计算出的声明块的文本表示形式，可以使用 JSON.stringify() 获取。
CSSStyleDeclaration.length 只读: 属性的数量。请参阅下面的 item() 方法。
CSSStyleDeclaration.parentRule 只读: 包含的 CSSRule。

CSS 属性

CSSStyleDeclaration.cssFloat: float CSS 属性的特殊别名。
CSSStyleDeclaration 命名属性: 所有支持的 CSS 属性的短横线和驼峰命名法属性。

实例方法

CSSStyleDeclaration.getPropertyPriority(): 返回可选的优先级，“important”。
CSSStyleDeclaration.getPropertyValue(): 给定属性名称返回属性值。
CSSStyleDeclaration.item(): 根据索引返回 CSS 属性名称，如果索引超出范围则返回空字符串。
CSSStyleDeclaration.removeProperty(): 从 CSS 声明块中删除属性。
CSSStyleDeclaration.setProperty(): 修改现有 CSS 属性或在声明块中创建新的 CSS 属性。
CSSStyleDeclaration.getPropertyCSSValue() 已弃用: 仅在 Firefox 的 getComputedStyle 中支持。将属性值作为 CSSPrimitiveValue 返回，或对于简写属性返回 null。

示例

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

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

console.log(styleObj.cssText);

规范

规范
CSS 对象模型 (CSSOM) # the-cssstyledeclaration-interface

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。