提问者:小点点

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


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

只要我使用“黄色”、“蓝色”、“红色”等颜色,这就完全可以了。

但是当我使用十六进制的颜色,比如“#000000”时,if-condition似乎没有注意到这个颜色,而是使用了else函数。

如果我使用“黑色”而不是“#000000”,则函数有效,背景变为红色。

我已经在jsfiddle上上传了工作样本。

你知道错误在哪里吗?

https://jsfiddle.net/c2gv9x01/

<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>

共1个答案

匿名用户

同一颜色有许多不同的字符串表示,因此简单地匹配十六进制颜色字符串并不一定有效,因为amy不是您的浏览器用来报告它的:

window.onload = function() {
  let body = document.querySelector("body")
  body.style.backgroundColor = "#000000"
  console.log(body.style.backgroundColor) // rgb(0, 0, 0) in most browsers
}