CSSStyleDeclaration getPropertyPriority() 方法

CSSStyleDeclaration getPropertyPriority() 方法返回指定CSS属性的优先级。在CSS中，优先级由!important声明和继承规则决定。

语法

var priority = style.getPropertyPriority(property)

参数

property

必选。要返回优先级的CSS属性名称。

返回值

返回一个字符串，表示指定属性的优先级，可能的值为：

• important（!important声明）
• normal（没有!important声明并且不是继承的）

示例

以下示例演示了如何使用getPropertyPriority()方法获取CSS属性的优先级：

<style>
    #myDiv {
        color: red !important;
        font-size: 16px;
    }
</style>

<div id="myDiv">Hello World!</div>

<script>
    var style = window.getComputedStyle(document.querySelector('#myDiv'));
    var priority1 = style.getPropertyPriority('color'); // 返回 "important"
    var priority2 = style.getPropertyPriority('font-size'); // 返回 "normal"
</script>

在上面的示例中，#myDiv元素的color属性被设置为red !important，而font-size属性没有任何!important声明和继承规则，因此其优先级为“normal”。

浏览器兼容性

| Chrome | Firefox | Edge | Safari | Opera | | ------ | ------- | ---- | ------ | ----- | | 1 | 1.5 | 12 | 3 | 9 |

总结

CSSStyleDeclaration getPropertyPriority() 方法可以方便地获取指定CSS属性的优先级，有助于开发人员了解CSS的继承规则和!important声明。