我们在做网页交互时经常要改变dom上的样式,这里总结下三种我常用的方式。
我们先定义一个class
<style>
.active{
color: #ffddcc;
}
</style>
1. 使用setAttribute()
let div1 = document.getElementById('div1')
div1.setAttribute('class', 'active')
浏览器兼容性: ie8 及以上
2. classList
let div2 = document.getElementById('div2')
div2.classList.add('active')
浏览器兼容性: ie10 及以上
3. className
let div3 = document.getElementById('div3')
div3.className('active')
浏览器兼容性: 全兼容