js classname

// 示例代码：使用 JavaScript 操作元素的 class 名

// 获取 HTML 元素
const element = document.querySelector('.my-element');

// 添加 class 名
element.classList.add('new-class');  // 添加一个名为 'new-class' 的 class

// 移除 class 名
element.classList.remove('old-class');  // 移除一个名为 'old-class' 的 class

// 切换 class 名 (如果存在则移除，不存在则添加)
element.classList.toggle('toggle-class');  // 切换 'toggle-class'

// 检查元素是否包含某个 class 名
if (element.classList.contains('specific-class')) {
    console.log('元素包含 specific-class');
} else {
    console.log('元素不包含 specific-class');
}

// 直接替换 class 名
element.className = 'brand-new-class';  // 将所有 class 替换为 'brand-new-class'

解释说明：

• classList 是一个用于操作元素类名的属性，提供了方便的方法来添加、移除、切换和检查类。
• add() 方法用于向元素添加一个新的类。
• remove() 方法用于从元素中移除指定的类。
• toggle() 方法用于切换类：如果类存在则移除它，如果不存在则添加它。
• contains() 方法用于检查元素是否包含指定的类。
• className 属性可以直接设置或获取元素的所有类名。