在 JavaScript 中单击按钮后如何更改背景颜色？

当我们单击按钮时，可以使用 JavaScript 更改页面元素的属性，例如改变背景颜色。

监听按钮点击事件

首先，我们需要监听按钮的点击事件，可以使用 addEventListener 方法。例如，我们有一个按钮的 ID 是 myButton，就可以使用以下代码来监听点击事件并调用一个函数：

document.getElementById("myButton").addEventListener("click", changeBgColor);

这里 changeBgColor 是我们自己定义的函数名称，用来更改背景颜色。

更改背景颜色

在 changeBgColor 函数中，我们可以使用 style 属性来更改背景颜色。例如，将页面背景颜色更改为红色：

document.body.style.backgroundColor = "red";

完整代码如下：

function changeBgColor() {
    document.body.style.backgroundColor = "red";
}

document.getElementById("myButton").addEventListener("click", changeBgColor);

当用户单击按钮时，页面背景颜色将更改为红色。

小结

在 JavaScript 中，我们可以使用 addEventListener 方法来监听按钮点击事件，并在事件触发时调用相应的函数。使用页面元素的 style 属性，我们可以更改页面的样式，例如更改背景颜色。