当前位置：科技动态 > 分别使用原生js和jQuery添加/删除元素的class属性

分别使用原生js和jQuery添加/删除元素的class属性

发布：2023-09-23 18:49

-->

一、原生js添加/删除元素的class属性：

// 获取元素
var ele = document.getElementsByClassName("abc");

// 方法1：直接赋值，会覆盖原有的值
ele.className = "test1";

// 方法2：利用className为字符串的属性，可在原有class属性值后面添加或删除新的值
ele.className += " test2";

// 方法3：利用classList属性的add()、remove()方法添加或删除属性值
ele.classList.add("test3");

二、jQuery添加/删除元素的属性

// addClass() 添加类属性值test1、test2
$("span").addClass("test1 test2");

// removeClass() 删除类属性值
$("span").removeClass("test");

// toggleClass("demo1") 切换类属性值（有/无），常用于事件触发，触发一次添加属性值，再触发一次删除属性值
$("span").toggleClass("test3"); -->