JavaScript如何检查元素是否为特定颜色？

我有一段代码，需要检查元素是否匹配颜色，如果匹配，则进行更改。否则，它将设置为默认颜色

var caps=$（“#caps”）；
如果（caps.css（'background-color'）=“rgb（225,0,0）”）{
$（'body'）。在（'click'，'#caps'，函数（事件）{
$（'.clight'）.css({
“背景色”：“红色”，
“框阴影”：“0px 0px 20px黄色”
});
$（'#l2'）.css({
“背景色”：“红色”，
“框阴影”：“0px 0px 20px黄色”
});
event.preventDefault（）；
}否则{
$（'.clight'）.css（'background-color'，'white'）；
})；

.caps{
/*大写按钮CSS*/
宽度：70px；
字体大小：12px；
线高：12px；
}
克利特先生{
/*Caps按钮灯CSS*/
宽度：10px；
高度：10px；
顶部：10px；
左边距：1px；
背景颜色：灰色；
位置：相对位置；
边界半径：50%；
}

盖
锁

注意：刚刚注意到您的代码中有一些javascript错误，因为您的

单击事件在错误的位置关闭


没有具体的方法可以做到这一点，比如不同的浏览器对颜色代码有不同的设置一些使用
rgb（）
一些
hex
等等

我建议您创建一些类并查找它们，例如：

.bg-red{ background-color:red; }

$('body').on('click', '#caps', function(event){
  if ($(this).hasClass('bg-red')) {
      $('.clight, #l2').css({
         'background-color' : 'red',
         'box-shadow' :  '0px 0px 20px yellow'
      });
      event.preventDefault();
  } else {
      $('.clight').css('background-color' , 'white');  
  }
});

我发现解决方案非常简单：

$('body').on('click', '#caps', function(event){
      $('.clight, #l2').toggleClass('on');
});

你能用CSS创建一个fiddle或将完整的html代码放在这里吗？定义“不起作用”。最好在这里使用一个类在检查每个案例之前，你必须做一个小技巧。你必须在所选节点上设置一个背景色，然后才能从$（selector.CSS（'background-color'）获得响应。如果在请求之前未设置此选项，则不起作用