使用jquery更改div的背景顏色！重要標記

使用調用使用自己的樣式表從外部託管的.jsp的插件（它是嵌入的yelp - 嘗試操作它的外觀）。在一個元素我試圖改變上有一個！重要的標記，而我似乎無法改變它...使用jquery更改div的背景顏色！重要標記

我試圖

<script type="text/javascript"> 
    $('.elementToChange').css({'background-color':'black'}); 
</script>

無濟於事。想法？

來源

2012-05-20 elzi

顯示HTML的一部分。 – NAVEED

如果已在外部樣式表中聲明'！important'，則設置將覆蓋任何其他設置，而不管通常的特定順序如何，除非後面的（更具體的）樣式*也會*聲明'！important'。順便說一下，這個問題可能與你有關：http://stackoverflow.com/questions/2655925/jquery-css-applying-important-styles –

http://stackoverflow.com/questions/462537/overriding-important-style-使用-javascript – Faust

看起來更上最新版本的jQuery（至少1.7 .2和更高版本），您可以簡單地設置css：

$('#elementToChange').css('background-color', 'blue');

請參閱http://jsfiddle.net/HmXXc/185/

在舊版本的jQuery和的Zepto你必須首先明確的CSS：

// Clear the !important css 
$('#elementToChange').css('background-color', '');

，然後使用復位：

$('#elementToChange').css('background-color', 'blue');

或者在一個班輪：

$('#elementToChange') 
    .css('background-color', '') 
    .css('background-color', 'blue');

參見http://jsfiddle.net/HmXXc/186/。

原來的答覆：

注：這可能是一個壞主意，因爲它會刪除任何其他內嵌樣式

我會編輯的樣式屬性直接

$('.elementToChange').attr('style', 'background-color: blue !important');

http://jsfiddle.net/RichardTowers/3wemT/1/

來源

2012-05-20 14:28:26 RichardTowers

雖然這會摔打已經附加到元素的任何樣式，這可能是個壞消息。我認爲增加班級更安全。 – RichardTowers

這工作 - 雖然@RichardTowers是正確的。它確實擦去了一切（不是問題，可以重新創建）。謝謝！ – elzi

這裏是您的解決方案：

http://jsfiddle.net/irpm/bdhpp/2/

的想法是要添加的類別：

$('.elementToChange').addClass('blackBg');

來源

2012-05-20 14:23:59

，幾乎工作...這裏是一個截圖：http://d.pr/i/qxPl 頂部是外部樣式表。背景：藍色是我用jquery添加的。下面是我的CSS中的東西，因爲外部的CSS沒有！重要的標籤。意見？ – elzi

嘗試在你的html中加載ybadge.css之後的style.css文件。你能做到嗎？ –

您可以使用follo翼功能：

function replaceBGColorImportant(element,newColor){ 
    var styles = element.getAttribute('style'); 
    styles = styles?styles.split(';'):[]; 
    var newStyles = []; 
    styles.map(function(x){ 
     if (x.split(':')[0] != "background-color") 
      newStyles.push(x); 
    }); 
    newStyles.push('background-color:#'+newColor+' !important'); 
    element.setAttribute('style',newStyles.join(';')); 
}

執行如下：

replaceBGColorImportant(document.body,'#009922');

來源

2014-08-12 13:14:37

通過正則表達式： https://jsfiddle.net/7jj7gq3y/2/

HTML：

<div class="elementToChange" style=" background-color: yellow !important; width: 100px; height: 100px;"></div>

JavaScript的：

var setImportantStyle = function(element, attributeName, value) { 
    var style = element.attr('style'); 
    if (style === undefined) return; 
    var re = new RegExp(attributeName + ": .* !important;", "g"); 
    style = style.replace(re, ""); 
    element.css('cssText', attributeName + ': ' + value + ' !important;' + style); 
} 
setImportantStyle($('.elementToChange'), 'background-color', 'red');

來源

2016-05-11 00:31:40

你可以操縱！通過使用下面的步驟來重要的CSS，要麼你可以使用inline-css或者Internal css，或者你可以在你預先加載的css的順序之後加載你自己的外部css，它會幫助你用你的自定義css重載那個css。

<html> 
    <head> 
    <!-- 
    //First Solution 
    //PreloaderCSS 
    //YourCustomCSS 

    //Second Solution 
    Internal CSS --> 
    </head> 
    <body> 
<!-- 
Third solution 
//Inline CSS 
-> 
    </body> 
    </html>

來源

2017-04-18 17:07:41

使用jquery更改div的背景顏色！重要標記

回答

相關問題