How can I dynamically change the background color of a webpage using JavaScript?

Altering Webpage Background Color with JavaScript

One common task in web development involves changing the background color of a webpage dynamically. Achieving this with JavaScript offers a straightforward solution.

To modify the background color, you can manipulate the document.body.style.background property in JavaScript. This property allows you to set the desired color value.

For instance, you could create a function that takes a color parameter and sets the background color accordingly:

function changeBackground(color) {
  document.body.style.background = color;
}

You can then call this function when the webpage loads to set the initial background color:

window.addEventListener("load", function() {
  changeBackground('red');
});

In this example, the webpage's background will be set to red when the page loads.

However, note that this may vary depending on your webpage's structure. If you're using a DIV container with a separate background color, you'll need to modify that element's background property instead of the document body.

The above is the detailed content of How can I dynamically change the background color of a webpage using JavaScript?. For more information, please follow other related articles on the PHP Chinese website!