class屬性的新增刪除

一：通過getAttribute

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 );複製程式碼

二：通過classList

為 <div> 元素新增 class:document.getElementById("myDIV").classList.add("mystyle"); 為 <div> 元素新增多個類:document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass"); 為 <div> 元素移除一個類:document.getElementById("myDIV").classList.remove("mystyle"); 為 <div> 元素移除多個類:document.getElementById("myDIV").classList.remove("mystyle", "anotherClass", "thirdClass"); 檢查是否含有某個CSS類myDiv.classList.contains('myCssClass'); //return true or false複製程式碼

三：通過className

function hasClass(ele, cls) {    return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));}//為指定的dom元素新增樣式function addClass(ele, cls) {    if (!this.hasClass(ele, cls)) ele.className += " " + cls;}//刪除指定dom元素的樣式function removeClass(ele, cls) {    if (hasClass(ele, cls)) {        var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");//正規表示式，需要補血        ele.className = ele.className.replace(reg, " ");    }}複製程式碼