新增标签对象.classList.add(新增属性值)
删除 标签对象.classList.remove(删除属性值)
替换标签对象.classList.replace(原始 , 新的)
切换标签对象.classList.toggle(切换属性值)有执行删除,没有执行新增
<body>
<div class = "box box2 "></div>
<script>
// 获取标签对象
const oDiv = document.querySelector('div');
// 新增
oDiv.classList.add("box1");
// 删除
oDiv.classList.remove("box");
// 替换
oDiv.classList.replace("box2","box3");
// 切换
oDiv.classList.toggle("box4");
</script>
</body>
运行结果: