如何使用jquery检查元素的背景颜色

Posted 2023-02-21

【中文标题】如何使用jquery检查元素的背景颜色

【英文标题】：How to check the background-color of an element using jquery

【发布时间】：2012-05-11 18:37:42

【问题描述】：

if($(this).css("background-color")==Crimson) 

这是正确的吗？ .css("background-color","white") 会改变颜色，但我不想改变，我想知道它是什么颜色。

【问题讨论】：

主流浏览器将始终返回rgb或rgba格式的背景颜色，旧浏览器将返回设置的值。

【参考方案1】：

它是这样工作的

if ($("#notify-9").css('background-color')=="rgb(220, 20, 60)") alert("matched");

您需要将名称转换为红、绿、蓝分量，您可以使用此工具

http://www.yellowpipe.com/yis/tools/hex-to-rgb/color-converter.php

【讨论】：

微妙的细节......在编写 rgb() 时，请注意第二个和第三个值之前的前导空格。

【参考方案2】：

使用引号"" 或''：

if($(this).css("background-color")=="Crimson") 

【讨论】：

请注意，这只适用于旧版浏览器。如果设置了"Crimson"，新浏览器将返回"rgb(220, 20, 60)"。试试看：$("<div>").css("background-color","Crimson").appendTo("body").css("background-color")

@micha：是的，如果没有设置，但背景名称显示 op 已设置。

【参考方案3】：

在颜色名称周围使用引号：

if( $(this).css("background-color") == "Crimson" ) 

否则是对的。

【参考方案4】：

只需使用下面的行

if($(this).css("background-color")=="crimson") 

因为css("background-color") 属性结果将是小写字母。因此，如果您将明显地与资本进行比较，它将返回错误。 :) 小技巧希望有用

【参考方案5】：

javascript 中可能的答案是这样的：

if(window.getComputedStyle(document.getElementById("notify-9"),null).getPropertyValue("background-color") == "rgb(220, 20, 60)")
   alert("matched!");

// rgb(220, 20, 60) 等于 Crimson