用Jquery閱讀風格屬性

我在我的頁面上有這樣的內容。用Jquery閱讀風格屬性

<div class="number_1" style="background-color:red"></div> 
<div class="number_2" style="background-color:yellow"></div> 
<div class="number_3"></div> 
<div class="number_4"></div> 
<div class="number_5" style="background-color:red"></div>

我不能通過添加background-color類來更改HTML代碼！它必須從風格變成紅色！

我需要這樣的

for(var i=1; i<=5; i++){ 
    if($('.number_'+i).hasBackgroundColor('red')){ 
     //something 
    }else{ 
     //somethign else 
    } 
}

.attr('style')==='background-color: red'功能不似乎工作

.css('background-color')也不要似乎工作

來源

2013-07-10 MateuszC

你是如何使用的CSS（）

$('<div style="background-color:red"></div>').attr('style') === 'background-color: red'

假

$('<div style="background-color:red"></div>').attr('style') === 'background-color:red'

真：步伐將給出不同的結果？ –

JQuery具有.css（）。看看他們的文檔在這裏：http://api.jquery.com/css/。他們也有很好的演示。 –

實際上，attr（'style'）工作，只是IE從其他瀏覽器返回不同的字符串。 – sinisake

在這裏，你得到的背景色：

var backgroundColor = $('.number_'+i).css('background-color');

它會返回類似「rgb（245，180，5）」。紅色是「rgb（255,0,0）」。

如果你喜歡得到十六進制值，例如＃FF0000爲紅色，使用這樣的功能：

function hexc(colorval) { 
    var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
    delete(parts[0]); 
    for (var i = 1; i <= 3; ++i) { 
     parts[i] = parseInt(parts[i]).toString(16); 
     if (parts[i].length == 1) parts[i] = '0' + parts[i]; 
    } 
    color = '#' + parts.join(''); 
}

來源

2013-07-10 11:52:38 Ricola3D

我認爲*有些瀏覽器可能會返回'rgba'而不是'rgb'，我認爲有些甚至有時會返回十六進制代碼。只是FWIW。 –

您可以嘗試使用.css()方法，該方法返回RGB。

for (var i = 1; i <= 5; i++) {  
    if ($('.number_' + i).css("background-color") == "rgb(255, 0, 0)") { 
    //something  
    } else { 
     //somethign else 
    } 
}

由於T.J. Crowder提到，上述代碼只適用於chrome而不適用於Firefox或IE。

同時嘗試使用RGB color parser in JavaScript

來源

2013-07-10 11:52:54 Praveen

@ T.J.Crowder謝謝。我已經添加了一個工作示例。 – Praveen

@ user：這是一個改進。不過，請注意，不同的瀏覽器以不同的方式返回值（有或沒有空格，例如，有時它們會返回'rgba'而不是'rgb'，我甚至有時甚至有時會返回十六進制代碼）。 –

CSS（ '背景色'）返回顏色的RGB你的情況「RGB（255,0,0）」。

來源

2013-07-10 11:53:13 BuDen

試試這個，

for(var i=1; i<=5; i++){ 
    if($('.number_'+i).css('background-color')=='red'){ // or ==rgb(255,0,0) 
     //something 
    }else{ 
     //somethign else 
    } 
}

來源

2013-07-10 11:54:01

我認爲css（'background-color'）會一直返回'rbg（...，...，...）' – Ricola3D

@ Ricola3D：是的，'rgb'或者我認爲在某些瀏覽器上你可能會得到十六進制顏色代碼。當然不是''紅色''。 –

@ T.J. Crowder只是爲了好奇（和未來的作品），哪些版本的瀏覽器會返回一個hexa代碼？ – Ricola3D

$(document).ready(function() { 
$.each($('div') , function(index) { 
alert($(this).attr('style')); 
}); 
});

而且，然後添加您的附加邏輯/條件，循環...

這樣的事情...

$(document).ready(function() { 
$.each($('div') , function(index) { 

style=$(this).attr('style'); 

if(style=='background-color: red;' || style=='background-color:red') { 

    alert($(this).attr('class')+' is red!'); 

} 

}); 
});

來源

2013-07-10 11:57:27 sinisake

.attr('style')==='background-color: red' dont seem to work

One s

來源

2013-07-10 11:57:48 webdeveloper

用Jquery閱讀風格屬性

回答

相關問題