js增删class的方法

Posted 2021-03-12 镇宁

接下来我来介绍两种方法

我们先来一段html代码

<div id="bb">  你好呀   </div>

接下来我们再来一段css样式

.ob
{
  color:red;  
}

好了，下面我们进入js开始说明方法了

第一种方法：

let bb = document.getElementById("bb");
bb.setAttribute("class","ob");   //此时div的字体已经变红  //增加了ob class类

//如果我们要进行查看呢
console.log(bb.getAttribute("class"));   //打印出来的是ob

第二种方法：

let bb = document.getElementById("bb");
bb.classList.add("ob");   //此时增加了一个class类，名为ob

//那要进行删除时我们该怎么办呢，看下

bb.classList.remove("ob");

但是这种方法如果是有列表时怎么办呢？

那么就使用遍历的方式确定的那个标签再进行添加样式即可完成