classList应用

HTML:
<div class="box">1</div>
<div class="box">2</div>
<div class="box">3</div>
<div class="box">4</div>
<div class="box">5</div>

JS:
var box = document.querySelectorAll(".box")
// 存在类
console.log(box[1].classList.contains("box"))

// 移除类
box[0].classList.remove("box")

// 添加类
box[0].classList.add("other")

// 如果 box 类值已存在，则移除它，否则添加它
box[0].classList.toggle("box")

// 替换类
box[0].classList.replace("box", "bar");

// 可以添加或移除多个类值！！用逗号隔开。

// 使用展开语法添加或移除多个类值
const cls = ["foo", "bar"];
div.classList.add(...cls);
div.classList.remove(...cls);