我在应用!important样式时遇到麻烦。 我试过了:
$("#elem").css("width", "100px !important");
这什么都不做 ; 不会应用任何宽度样式。 有没有一种类似jQuery的方式来应用这种样式,而不必覆盖cssText (这意味着我首先需要解析它,等等)?
编辑 :我应该补充一点,我有一个样式表,具有!important样式,我试图用!important样式内联重写,所以使用.width()之类的方法不起作用,因为它被我的外部!important样式覆盖。
此外,将覆盖以前的值的值的计算 ,所以我不能简单地创建另一个外部风格。
#1楼
David Thomas的答案描述了一种使用$('#elem').attr('style', …) ,但警告使用它会删除style属性中先前设置的样式。 这是一种使用attr()而不出现问题的方法:
var $elem = $('#elem');
$elem.attr('style', $elem.attr('style') + '; ' + 'width: 100px !important');
作为功能:
function addStyleAttribute($element, styleAttribute) {
$element.attr('style', $element.attr('style') + '; ' + styleAttribute);
}
addStyleAttribute($('#elem'), 'width: 100px !important');
#2楼
此解决方案不会覆盖任何先前的样式,而只是应用您需要的样式:
var heightStyle = "height: 500px !important";
if ($("foo").attr('style')) {
$("foo").attr('style', heightStyle + $("foo").attr('style').replace(/^height: [-,!,0-9,a-z, A-Z, ]*;/,''));
else {
$("foo").attr('style', heightStyle);
}
#3楼
我们首先需要删除以前的样式。 我使用正则表达式将其删除。 这是更改颜色的示例:
var SetCssColorImportant = function (jDom, color) {
var style = jDom.attr('style');
style = style.replace(/color: .* !important;/g, '');
jDom.css('cssText', 'color: ' + color + ' !important;' + style); }
#4楼
这是我遇到这个问题后所做的...
var origStyleContent = jQuery('#logo-example').attr('style');
jQuery('#logo-example').attr('style', origStyleContent + ';width:150px !important');
#5楼
在头部附加样式的另一种方法:
$('head').append('');
这会将样式附加到所有CSS文件之后,因此它将具有比其他CSS文件更高的优先级并被应用。