Javascript 防止addRule被剥离！重要的

我正在尝试制作一个jQuery插件，将CSS规则注入页面。我正在使用

addRule

和

insertRule

。出于某种原因，

addRule

去掉了

！重要信息

来自您传递给它的任何规则。有什么方法可以阻止它这样做，或者可以向函数发送一个标志来标记规则是否重要？我看了看报纸，但没有提到！重要宣言

document.getElementsByTagName（'head'）[0].appendChild（document.createElement（'style'））；
var sheet=document.styleSheets[document.styleSheets.length-1]；
sheet.addRule（'body'，'color:green！important'）
h1{
颜色：黄色；
}
测试文本
我不相信
！重要提示
您期待的气泡<代码>！重要信息

允许规则优先于具有相同选择器的其他规则。考虑：

#我{颜色：蓝色！重要；}
你好，世界

sheet.addRule（'me'，'color:green！important；'）；

您会注意到，

#me

在样式表中应该是蓝色的，但是它被

addRule

覆盖

---

在您的示例中，您是说您希望体色渗透到段落中，但是

！重要信息

是在具有相同选择器的规则之间进行选择，而不是层次结构

在这种情况下，没有样式表。。。。（所以你的代码片段在这里根本不起作用…@CayceK我已经用开发人员工具验证过，当存在样式表时，这不起作用。我在上面的代码片段中添加了一个样式表。这很奇怪，因为我知道我以前做过。所以我可以提交另一个答案，或者我可以复制@bishop。基本上他是对的。我从不使用

！重要信息

所以我没有立即意识到这个基本事实。您正在使用

！重要信息

错误。然而。当您应该改用

insertRule

时，您也在使用

addRule

。这将帮助您在不使用

的情况下覆盖要覆盖的css样式！重要信息

。请看@CayceK在我的评论中很难看到链接，感谢您将其包含在您的评论中并指出这一“重要”点！经过一些测试，我认为选择器的特殊性是问题所在，而不是

！重要信息

正在剥离。似乎重要的是不允许一个不太具体的选择器覆盖一个更具体的选择器。解决这个问题的真正微妙的区别是对

addRule

使用与CSS中相同的选择器。这是您的小提琴的固定版本：我在其中添加了

！重要信息

到页面的CSS，以便我可以检查它是否被正确覆盖。@AlexW:很高兴它被修复了！对于未来的路人，这里是技术意义上的。

<style>
#me { color:blue !important; }
</style>
<p id='me'>Hello, World</p>
<script>
sheet.addRule('#me','color: green !important;');
</script>