通过点击更改div颜色的最简单方法是什么？

Question

点击时我正在尝试更改div的背景颜色。这是我写的代码：

<div style="background-color:red" onClick="this.style='background-color:blue'"></div>

由于某种原因，这没有奏效。我确定这是一个语法问题。有人可以帮忙吗？

谢谢！

Answer 1

背景颜色可以称为DOM属性：this.style['background-color']

<div style="background-color:red" onClick="this.style['background-color']='blue'">Demo Text</div>

或作为JS属性：this.style.backgroundColor

<div style="background-color:red" onClick="this.style.backgroundColor='blue'">Demo Text</div>

后者更受欢迎。浏览器确保DOM属性和安全性。 JS属性是同步的。

检查demo：

Answer 2

<div style="background-color:red" onClick="this.style.backgroundColor = 'blue'"></div>

Answer 3

尝试：

<div style="background-color:red" onClick="this.style.backgroundColor='blue'"></div>