javascript - 如何使用 .css() 应用 !important？

Question

我在应用 !important 样式时遇到问题。我试过了:

$("#elem").css("width", "100px !important");

这什么都不做；没有应用任何宽度样式。有没有一种 jQuery 风格的方式来应用这种样式而不必覆盖 cssText (这意味着我需要先解析它，等等)？

编辑:我应该补充一点，我有一个带有 !important 样式的样式表，我试图用 !important 样式覆盖它内联，因此使用 .width() 等不起作用，因为它被我的外部 !important 样式覆盖。

另外，将覆盖先前值的值是计算出来的，所以我不能简单地创建另一个外部样式。

Answer 1

问题是由于jQuery不理解!important属性导致的，因此无法应用规则。

您也许可以解决这个问题，并通过引用它来应用规则，通过 addClass():

.importantRule { width: 100px !important; }

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

或者通过使用 attr():

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

不过，后一种方法会取消任何先前设置的内联样式规则。所以要小心使用。

当然，@Nick Craver 的方法更容易/更明智。

上述，attr() 方法稍作修改以保留原始 style 字符串/属性，并按照 falko 的建议进行修改在评论中:

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