如何更改 html 元素的颜色

Question

如何通过单击按钮更改 html 元素的颜色我正在制作游戏，需要这个来改变玩家的颜色编辑任何人在未来看到这个我试图做的是拿一个 Html 元素并通过点击按钮改变它的颜色如果你不明白这里是一个视觉

如果您运行此代码，它会显示一个红色框和一个按钮

<!DOCTYPE html>
<html>
    <body>
        <div id="player" style="background:blue;height: 200px;width: 100px;">
            <button> Change Color </button>
    </body>
    </html>

Answer 1

在下面的代码中，我有一个普通的 div，它具有背景颜色、高度和宽度。我还有一个带有 onclick 函数的按钮，该按钮在 javascript 代码（脚本标签之间）中定义。单击按钮时，我调用了“changeCol”函数。在 changeCol 函数中，我通过查找 ID 为“myDiv”的元素获得 div，然后使用 .style 指定我想要更改的样式元素，和 .background 改变背景颜色。

<!DOCTYPE html>
<html>
<body>
    <div id="myDiv" style="background:red;height: 200px;width: 100px;">
    </div>
    <button onclick="changeCol()">Click me</button>

   <script>
     function changeCol() {
         document.getElementById("myDiv").style.background = "yellow";
     }
    </script>
</body>
</html>

如何更改 html 元素的颜色

How do you change the color of a html element

html

javascript

element

colors

button