如何测试某个元素是否已具有指定的颜色？

在JavaScript中的颜色分配给具有id为'ID'元素中使用jQuery我们分配如下：如何测试某个元素是否已具有指定的颜色？

$('#ID').css({'background-color':'#FF0000'});

但如何知道该元素是否已经被分配了一个颜色？

我需要检查元素是否已经被赋值为红色。如果已经分配了红色，我需要在JavaScript中设置一些标志。

来源

2010-12-23 Joy

在jquery中使用.attr（）函数来获取有关属性的信息。

http://api.jquery.com/attr/

喜欢的东西

$("#ID").attr('style')

应该是一个良好的开端。

来源

2010-12-23 08:22:29 Oli

感谢您的响应.. – Joy 2010-12-23 08:42:30

获得VAL

var old_css = $('#ID').css('background-color');

或使用

var old = document.getElementById("id").style.backgroundColor;

也看看这个帖子

Can jQuery get all CSS styles associated with an element?

来源

2010-12-23 08:22:37

像哈伊姆Evgi建议，你可以得到的CSS的值元素，但是如果你试试这个

console.log(jQuery('#someId').css('background-color'));

对于没有任何background-color集的元素，您将获得transparent。现在让我们假设你想扩展你的用例不仅涵盖#f00，而且是一个可变的颜色，你可能会陷入困境。

我最初的想法，一边读你的问题是使用CSS类来鉴定的变化：

CSS

/* i assume red indicates an error :) */ 
.error { background-color: #f00; }

的JavaScript

if(jQuery('#someId').hasClass('error')) { 
    /* do something fancy */ 
}

或

jQuery.each(jQuery('.error'), function(index, value) { 
    /* do something with each erroneous element */ 
});

这麦es设置和检查更改也会稍微舒适一些。

[编辑：样品片段]

<!DOCTYPE html> 
<html> 
    <head> 
    <style type="text/css"> 
     .error{ background-color: #f00; } 
    </style> 
    <script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> 
    <script type="text/javascript" language="javascript"> 
    jQuery(document).ready(function() { 
     console.log('Background #someId: ' + jQuery('#someId').css('background-color')); // transparent 
     console.log('Background #someOtherId: ' + jQuery('#someOtherId').css('background-color')); // transparent 

     console.log('#someId has error: ' + jQuery('#someId').hasClass('error')); // false 
     console.log('#someOtherId has error: ' + jQuery('#someOtherId').hasClass('error')); // false 

     jQuery('#someOtherId').addClass('error'); 

     console.log('#someId has error: ' + jQuery('#someId').hasClass('error')); // false 
     console.log('#someOtherId has error: ' + jQuery('#someOtherId').hasClass('error')); // true 
    }); 
    </script> 
    </head> 
    <body> 
    <div id="someId">foo</div> 
    <div id="someOtherId">bar</div> 
    </body> 
</html>

来源

2010-12-23 08:40:23 codeporn

感谢您的快速响应...... – Joy 2010-12-23 08:46:02

如何测试某个元素是否已具有指定的颜色？

回答

相关问题