积累知识,胜过积蓄金银!毕竟在文章开发的过程中,会遇到各种各样的问题,往往都是一些细节知识点还没有掌握好而导致的,因此基础知识点的积累是很重要的。下面本文《JavaScript的classList属性用于轻松操作元素的类名,支持添加、移除、切换和检查类。以下是基本用法:1. 获取类名列表const element = document.getElementById("myElement");
console.log(element.classList); // 返回 DOMTokenList 对象2. 添加类名element.classList.add("new-class"); // 添加一个类
element.classList.add("class1", "class2"); // 添加多个类3. 移除类名element.classList.remove("old-class"); // 移除一个类
element.classList.remove("class1", "class2"); // 移除多个类4. 切换类名(存在则移除,不存在则添加)element.classList.toggle("active"); // 切换 "active" 类5. 检查类名是否存在if (element.classList.contains("hidden")) {
console.log("类 'hidden' 存在");
}6. 替换类名element.classList.replace("old-class", "new-class"); // 将 "old-class" 替换为 "new-class"示例:动态切换主题