js在不刪除原有類名追加新類名方法

element.classlist.add(class1, class2, ...);

element.classlist.remove(class1, class2, ...);

function addclass(el, classname) else

}//新增新類名
oldclassstr += classname;
el.setattribute('class',oldclassstr);
}

addclass(el,"classname1 classname2");

function delclass(el,classname)

//獲取原有的類名
var oldclassstr = el.getattribute('class');
//把原來的類名分割後新增入陣列,判斷要新增的類名是否已存在
var oldclassarr = oldclassstr.split(' ');
//獲取要刪除了類名的下標
var index = oldclassarr.indexof(classname);
//如果!=-1,說明存在,才可以執行刪除
if(index!=-1)
//把刪除後的陣列轉為字串
oldclassstr = oldclassarr.join(' ');
el.setattribute('class',oldclassstr);
}

delclass(el,"classname1 classname2");

原生JS新增類名 刪除類名

為 元素新增 class document.getelementbyid mydiv classlist.add mystyle 為 元素新增多個類 document.getelementbyid mydiv classlist.add mystyle anotherclass thirdclass...

原生js新增類名

動態新增class類名在前端開發過程中是很常見得做法，比如說在實現輪播圖的時候給當前的錨點新增乙個active類,有又或者在實現動畫的時候新增乙個終態css類。當然，有很多js庫中封裝了新增類名的方法，典型的比如jquery中的addclass 方法。但是，在實際開發中，如果頁面比較簡單，邏輯功能不...

原生JS增 刪 改 查 類名

element.classlist是乙個唯讀屬性，返回乙個元素的類屬性的實時domtokenlist集合。相比將element.classname作為以空格分隔的字串來使用，classlist是一種更方便的訪問元素的類列表的方法。const elementclasses elementnoderef...