jQuery：獲取內聯樣式而不是body的CSS
[英]jQuery: get inline style not CSS of body
問題描述
我試圖獲得內聯元素的真實風格，但它始終將css應用於它。 我不想修改我的CSS，太多的頁面依賴它。
<body class="processed" style="padding-top: 157px ;margin-top: 0px;">
我的CSS
.processed{padding-top: 56px !important;}
JS：
$(function(){
var pad = $('body').css('padding-top');
$('body').attr('style','padding-top:'+ pad +' !important; margin-top: 0px;');
console.log('pad' + pad);
});
其結果是： body與內嵌樣式56px ，而不是157px ...
3 個解決方案
解決方案1
1 2015-11-30 17:51:09
您可以在CSS文件中創建第二個“重要”類，因此它不會影響其他頁面，但它會覆蓋第一個“重要”類。
你只需要在第一個之后編寫新類。
例如：
HTML：
<body class="processed processed-large-top">
CSS：
.processed{padding-top: 56px !important;}
.processed-large-top{padding-top: 157px !important; margin-top: 0px;}
解決方案2
1 已采納 2015-12-30 20:54:59
解決了，問題是在DOM准備好后腳本覆蓋樣式......重要的是扮演了一個好角色..
解決方案3
0 2015-11-30 18:00:03
帶有！important的 CSS規則比內聯樣式具有更高的優先級。 要覆蓋它，你必須在內聯樣式CSS上使用！important 。
因此，您的HTML標記最終必須如下：
<body class="processed" style="padding-top: 157px !important;margin-top: 0px;">
如何使用JavaScript獲取被CSS！important覆蓋的內聯樣式
[英]How to get inline style that was overridden by CSS !important using JavaScript
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.