解释如何用JS添加和删除类名

下面描述如何向节点添加和删除类名

Add: classList.add('类名')；

删除：节点。classList.remove('类名')；

以选项卡切换为例：

在编写选项卡切换时，我们通常会为选定的选项卡设置不同的样式。常见的方法是在选定的选项卡中添加一个类名，然后更改该类名的样式。

例如，一个类被称为“活动的”

设置样式。活动{ color: #FFD113！重要；}将活动类名添加到html代码的第一页(默认情况下选中)

a class=' tab _ item active ' span class=' icon font icon-suye '/span span class=' tab 2 '主页/span/a效果如下：

在点击切换的过程中，我们需要给选中的子选项加上“active”，然后让其他子选项删除“active”的名称。

我该怎么办？

首先，通过JS获取所有标签节点

var arr=document . getelementsbyclassname(' tab _ item ')；那就补充一下。向选定的子节点添加('类名')，例如：

arr[I]. class list . add(' active ')；这会将“活动”类名添加到当前子选项卡中。

然后我们去掉“活动”的其他选项卡，只需添加。classList.remove(类名)位于其他子节点之后，例如：

arr[j]. class list . remove(' active ')；这样，我们达到了预期的功能。

当然，也可以使用其他方法，

以上是边肖介绍的用JS添加和删除类名的详细说明和集成，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！