通过js添加class名的三种方式

我们在做网页交互时经常要改变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')

浏览器兼容性： 全兼容