使用jQuery添加重要內容

我遇到了一個我無法解釋的問題。使用jQuery添加重要內容

我在那個功能，我加入了一些內嵌樣式的元素寫了一個函數：

myEm.css({"margin":"0", "position":"fixed", "top":"50px", "left":"50px"});

它工作得很好，但我注意到，這個元素已經有了一定的餘量在CSS文件中設置，它使用！重要的，所以我將能夠覆蓋的唯一方式是改變我的代碼

myEm.css({"margin":"0 !important", "position":"fixed", "top":"50px", "left":"50px"});

然而，當我這樣做，整個容限屬性被丟棄。似乎有點奇怪，但經過測試，我懷疑感嘆號是一個罪魁禍首。我需要以某種方式逃避它使用編碼字符？我錯過了什麼？

來源

2014-11-21 santa

您可以用'！important'和CSS類向元素添加CSS樣式。 – 2014-11-21 17:03:38

爲什麼手動設置CSS？爲什麼不創建新的CSS規則並在需要時應用它？ – 2014-11-21 17:05:03

你或許可以看到你的答案在這裏： http://stackoverflow.com/questions/2655925/how-to-apply-important-using-css – marvs 2014-11-21 17:12:46

最好的方法是創建一個新的CSS樣式margin !important和CSS添加的元素。

CSS：

.zeroMargin { margin: 0 !important; }

，然後在JS：

myEm.css({"position":"fixed", "top":"50px", "left":"50px"}).addClass('zeroMargin');

或者，你也可以做到這一點完全與JS使用cssText

myEm.css("cssText", "margin:0 !important;position:fixed;top:50px;left:50px;"});

這相當於設置該元素的style.cssText屬性。所以，你可能不需要在這種情況下的!important ..

要保留您可以使用功能類似下面，

$('#cssTest').css('cssText', function(i, v) { 
 
    return this.style.cssText + ';border-color: blue !important;'; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="cssTest" style="border: 1px solid red !important; width: 100px; height: 100px;"></div>

來源

2014-11-21 17:06:40

做它的JavaScript函數的方式：

myEm[0].style.setProperty('margin', '0', 'important');

來源

2014-11-21 17:04:25 Joanvo

下面是一個方便的技巧我在另一個post發現：

myEm.attr('style', function(i,s) { return s + 'margin: 0 !important;' });

來源

2014-11-21 17:19:02

這不會覆蓋其他風格保證金屬性設置，你可能最終得到兩個值作爲保證金屬性，這兩個值都是重要的！ – Joanvo 2014-11-21 19:02:22

這個問題說，原始邊距是通過一個CSS文件設置的 – 2014-11-22 07:20:34

使用jQuery添加重要內容

回答

相關問題