每次单击按钮时如何更改颜色？

html5 • • 问答

当我单击按钮时，我希望每次单击时主体颜色都会改变

但它只改变了一次。如果我再次单击 ，颜色不会改变。

我不知道我在代码上有什么错误？

let click = document.querySelector('.click');
let random_color = "#" + Math.floor(Math.random() * 16777215).toString(16);


click.addEventListener('click', () => {
  color();
})

function color() {
  document.body.style.backgroundColor = random_color;
}
body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 90vh;
}
<button>click</button>
<button>click</button>

回答

只需将color()函数外部的随机颜色变量形式移动到函数内部即可color()。

这是片段：

let click = document.querySelector('.click');

click.addEventListener('click', () => {
  color();
})

function color() {
  let random_color = "#" + Math.floor(Math.random() * 16777215).toString(16);
  document.body.style.backgroundColor = random_color;
}
以上是每次单击按钮时如何更改颜色？的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>
相关内容