1.比較傳統的方法

var classVal = document.getElementById("id").getAttribute("class");//刪除的話 classVal = classVal.replace("someClassName",""); document.getElementById("id").setAttribute("class",classVal );//添加的話 classVal = classVal.concat(" someClassName"); document.getElementById("id").setAttribute("class",classVal );//替換的話 classVal = classVal.replace("someClassName","otherClassName"); document.getElementById("id").setAttribute("class",classVal ); 復制代碼

2.html5增加了classList

classList 屬性返回元素的類名，作為 DOMTokenList 對象。

該屬性用于在元素中添加，移除及切換 CSS 類。

classList 屬性是只讀的，但你可以使用 add() 和 remove() 方法修改它。

classList屬性的方法有：

• add(value) 添加類名，如果有則不添加
• contains(value) 判斷是否存在類名，返回Boolean值
• remove(value) 從列表中刪除類名
• toggle(value) 切換類名：如果列表中存在則刪除，否則添加

增加：document.getElementById("myDIV").classList.add("mystyle",?"anotherClass",?"thirdClass");去除：document.getElementById("myDIV").classList.remove("mystyle"); 復制代碼

參考：

js增加class或者刪除class 原生js刪除增加修改class屬性

總結

以上是生活随笔為你收集整理的原生js增加或者删除class的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。