Javascript 为什么我的背景不会在点击时用十六进制颜色改变？

我有一个html文档，我想通过单击按钮来更改文档的背景色

只要我使用诸如“黄”、“蓝”、“红”等颜色，这一切都很好

但是当我使用十六进制颜色时，比如“#000000”，if条件似乎没有注意到，该颜色使用else函数

如果我使用“黑色”而不是“#000000”，该函数将工作，背景将变为红色

我已经在JSFIDLE上上传了工作示例

你知道错误在哪里吗

颜色开关
window.onload=function（）{
document.querySelector（“body”）.style.backgroundColor='#000000'；
document.querySelector（“按钮”）.addEventListener（“单击”，颜色）；
}
函数颜色（）{
if（document.querySelector（“body”）.style.backgroundColor=='#000000'）
{document.querySelector（“body”）.style.backgroundColor='red'；}
else{document.querySelector（“body”）.style.backgroundColor='#000000'}
}

同一颜色有许多不同的字符串表示形式，因此简单地匹配十六进制颜色字符串不一定有效，因为这不是您的浏览器用来报告的颜色：

window.onload=function（）{
let body=document.querySelector（“body”）
body.style.backgroundColor=“#000000”
console.log（body.style.backgroundColor）//rgb（0,0,0）在大多数浏览器中
}

如果您记录

backgroundColor

，您会看到什么？似乎工作正常：@jonaswillms如何在本例中记录backgroundColor？@gautam1168谢谢，但在您的版本中，if条件与单词“black”一起工作。如果我输入十六进制数，它将不再工作。您必须将颜色解析为统一的rgb格式。您可以使用library like（）我想更改网站上几个元素的颜色。例如SVG和背景色。这就是为什么我必须更改元素的特定颜色。这不会有任何区别；我在这里展示的相同技术可以用于任何元素，而不仅仅是文档体。（如果您需要为svg的一部分而不是整个内容设置样式，）好的，很好，这似乎是更有效的方法，谢谢！

<button>COLOR SWITCH</button>



<script>
window.onload=function(){
    document.querySelector("body").style.backgroundColor = '#000000';
    document.querySelector("button").addEventListener("click", color);
}

function color() {

    if (document.querySelector("body").style.backgroundColor == '#000000') 
{document.querySelector("body").style.backgroundColor = 'red'; }


     else {document.querySelector("body").style.backgroundColor = '#000000';}
}
</script>