Question

如何在纯 JavaScript 中编写 IF 条件，以检查<li>标记的背景颜色是否等于特定的RGBA颜色组合。

例如：

if(document.getElementById('element').style.backgroundColor == "rgba(213,212,212,0.5)")
{
     alert("MATCHED");
}
else
{
     alert("FAILED");
}

但IF语句的这种比较 NOT 有效！请帮忙！

Answer 1

以特定方式返回CSS值。

尝试将其与"rgba(213, 212, 212, 0.5)"

进行比较

（每个逗号后面的空格）。

由于JavaScript的舍入错误是最糟糕的，而且你真的不关心alpha，你可以删除你需要的部分：

var color = document.getElementById('element').style.backgroundColor;
color = color.substring(
                          color.indexOf('(') + 1,
                          color.lastIndexOf(color[3] == 'a' ? ',' : ')')
                        );

if (color == '213, 212, 212')
{
    alert("MATCHED");
}
else
{
    alert("FAILED");
}

无论是rgb还是rgba

，都可以使用

如果background-color未定义为内联样式，您可能需要使用：

var color = window.getComputedStyle（document.getElementById（＆＃39; element＆＃39;））。backgroundColor;

代替（代码中的第一行）。

Answer 2

检查

window.getComputedStyle(document.getElementById('element')).backgroundColor

而不是

document.getElementById('element').style.backgroundColor

所以你的新代码将是：

if(window.getComputedStyle(document.getElementById('element')).backgroundColor === "rgba(213,212,212,0.5)")
{
     alert("MATCHED");
}
else
{
     alert("FAILED");
}

（正如你所看到的，我用三个等号检查，因为不需要转换。）

Demo

RGBA中具有背景颜色的IF条件

2 个答案: