jquery - CSS !important 似乎在 jQuery/Firefox 3.x 中不起作用

标签 jquery css firefox

参见 fiddle :http://jsfiddle.net/csaltyj/P2sLa/

在 Chrome 中,这可以正常工作,但在 Firefox 中却不行,并且会产生一个 Javascript 警告。我知道这里不需要 !important,但我有一个需要它的大型元素,它导致 Firefox 崩溃。有什么想法吗?

最佳答案

搜索“jquery css important”出现a blog post explaining the "problem" .
我将发布一些其他信息,但长话短说,here's your solution :

$('#set-bg').click(function() {
    $('#box').css('cssText', 'background: blue !important');
});

作者声明:

This is not a bug but something that most browser doesn’t acknowledge a need since inline style already have the highest priority other than user defined ones. (unless you do not want your user to change how they view your website).

请注意使用cssText有一个缺点,您可能需要考虑
使用 cssRules相反:

cssText will overwrites the css of that particular element. Hence, you will have to redeclare the rule for that particular element all over again.

话虽如此。请听作者总结:

Using !important in CSS is not advisable since it might kill your web usability. Furthermore, there is no reason why !important should be use as inline styling already has the highest priority. Hence, you might want to reconsider applying !important on your script after thinking about the consequences that might bought to your users.

关于jquery - CSS !important 似乎在 jQuery/Firefox 3.x 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5861052/

相关文章:

javascript - 如何让我的 overflow-x 滚动只使用两个按钮?

html - Firefox 29 类型 ="number"与 CSS :focus broken

javascript - 在 jquery 选项卡中查找 span 标签并返回该索引

javascript - jQuery:更改 div ID 不起作用

jquery - 将鼠标悬停在同一元素上时重复更改图像

javascript - 无法使用 Firefox 下载 blob 文件,但可以在 Chrome 中使用?

javascript - Firefox:shadow-DOM 兼容性

css header 问题

html - 将垂直类别菜单变成手机上的下拉菜单

css - 如何过渡只是为了变换旋转