写4个按钮,每个按钮代表一个颜色,点击按钮时,会使整个屏幕变成相应的颜色
时间: 2023-08-11 21:05:21 浏览: 28
HTML 代码:
```html
<button id="red-btn">红色</button>
<button id="green-btn">绿色</button>
<button id="blue-btn">蓝色</button>
<button id="yellow-btn">黄色</button>
```
JavaScript 代码:
```javascript
const redBtn = document.getElementById('red-btn');
const greenBtn = document.getElementById('green-btn');
const blueBtn = document.getElementById('blue-btn');
const yellowBtn = document.getElementById('yellow-btn');
const body = document.body;
redBtn.addEventListener('click', () => {
body.style.backgroundColor = 'red';
});
greenBtn.addEventListener('click', () => {
body.style.backgroundColor = 'green';
});
blueBtn.addEventListener('click', () => {
body.style.backgroundColor = 'blue';
});
yellowBtn.addEventListener('click', () => {
body.style.backgroundColor = 'yellow';
});
```
这样,当用户点击红色按钮时,整个屏幕就会变成红色;点击绿色按钮时,整个屏幕就会变成绿色,以此类推。