如何使用 JavaScript 覆盖内联 `!important` 样式？

使用 JavaScript 覆盖内联 !important 样式

jQuery 的 .css() 方法不会应用标有 !important 属性的样式。当尝试覆盖包含 !important 的现有内联样式时，这可能会令人沮丧。

解决方案：

使用以下方法之一克服此限制：

1. 将 addClass() 与类一起使用规则：

   • 创建具有所需样式的 CSS 类！重要样式：

     .importantRule { width: 100px !important; }

   • 将该类应用于目标element:

     $('#elem').addClass('importantRule');

2. 使用 attr() 设置内联样式：

   • 此方法会覆盖任何现有的内联样式：

     $('#elem').attr('style', 'width: 100px !important');

   • 要保留现有的内联样式，请使用此修改版本：

     $('#elem').attr('style', function(i,s) { return (s || '') + 'width: 100px !important;' });

以上是如何使用 JavaScript 覆盖内联 `!important` 样式？的详细内容。更多信息请关注PHP中文网其他相关文章！