js点击改变css样式
时间: 2023-09-13 07:03:09 浏览: 246
可以使用JavaScript来实现点击改变CSS样式的效果。具体方法如下:
1. 选择需要改变样式的元素,可以使用document.querySelector()方法来选取元素。
2. 给元素添加点击事件,可以使用addEventListener()方法来添加。
3. 在点击事件中修改元素的样式,可以使用元素.style来修改CSS属性。
例如,下面的代码可以实现点击按钮改变背景色的效果:
HTML代码:
```
<button id="btn">点击我</button>
```
CSS代码:
```
body {
background-color: white;
}
```
JavaScript代码:
```
const btn = document.querySelector('#btn');
btn.addEventListener('click', function() {
document.body.style.backgroundColor = 'red';
});
```
当点击按钮时,就会将背景色改为红色。
阅读全文