使用 jQuery 修改 css 中带有 !important 的样式属性

最新推荐文章于 2023-05-15 10:54:30 发布

kirinlau

最新推荐文章于 2023-05-15 10:54:30 发布

阅读量2.4k

点赞数 3

分类专栏： javascrip css3 前端

本文链接：https://blog.csdn.net/kirinlau/article/details/87696436

版权

36 篇文章

订阅专栏

30 篇文章

订阅专栏

5 篇文章

订阅专栏

外部的css样式为：

#imageArea{
    width: 200px;
    height: 300px;
    background-color: #eee !important;
}

通过以下代码来修改其背景色是无效的

$("#imageArea").css("background-color", "#444444")
$("#imageArea").css("background-color","#444444 !important");

查阅资料得要想修改 div 的背景色（其他样式也一样），可以通过如下这种方式：

$("#imageArea").css("cssText", "background-color:#444444!important");

如需修改多个样式，可以使用以下方法：

 $("#imageArea").css("cssText", "height:480px !important; overflow:scroll !important");

备注：
cssText 属性，会把先前的 css 值全部给覆盖掉，为了保留先前其他的样式，可以把现有样式赋值给cssText，像比如要保留width属性，当然cssText也可以链式设置样式：

var cssText = $("#imageArea").attr("style") + ";width:200px !important;";
$("#imageArea").css("cssText": cssText);

其他更多cssText应用请参考cssTex资料