CSSStyleDeclaration: getPropertyValue() 方法

语法

getPropertyValue(property)

参数

property（属性）

一个字符串，表示要检查的属性名称（使用连字符命名法）。

返回值

一个包含属性值的字符串。如果未设置，则返回空字符串。

属性值是动态计算的，而不是在声明中最初指定的。序列化过程如下：

• 如果 property 是一个简写属性，则获取它对应的所有长格式属性。请注意，原始样式表中指定的简写属性在解析时已经被展开。如果这些长格式属性中至少有一个未声明，或者它们的 !important 状态不同，则结果为空字符串。否则，将返回一个扩展为相同长格式属性值列表的属性值，该简写值将省略尽可能多的组件，并根据正式定义中的规范顺序重新排序（如果可能）。如果上述任何语法转换向后兼容性较差，则不执行它们。
• 否则，属性将根据其数据类型进行序列化。每种数据类型都有一个规范表示形式；例如，<color> 值始终使用 rgb(R, G, B) 或 rgba(R, G, B, A)。

本质上，属性值被规范化，以确保具有相同渲染效果的两个属性值即使声明不同也能相等。

示例

以下 JavaScript 代码查询 CSS 选择器规则中 margin 属性的值

const declaration = document.styleSheets[0].cssRules[0].style;
const value = declaration.getPropertyValue("margin"); // "1px 2px"

返回的字符串可能与元素样式规范中指定的值不同。例如，这种样式

p#blueish {
  color: hsl(250 90 50);
}

const declaration = document.styleSheets[0].cssRules[0].style;
const value = declaration.getPropertyValue("color");

将设置一个值 rgb(51, 13, 242);。这在按字符串比较样式时很重要。

规范

浏览器兼容性