如何在jQuery中添加和删除多个类

在jQuery中添加和删除多个类是非常常见的需求。下面是详细的攻略：

添加多个类

在jQuery中，我们可以使用 addClass 方法一次性添加多个类。这个方法接受一个参数，参数是要添加的类名，可以是一个字符串或者以空格分隔的多个字符串。

假设我们有一个div元素，需要添加两个类名，分别是foo和bar。我们可以这样写：

$( "div" ).addClass( "foo bar" );

这个方法会向所有匹配元素添加这两个类。

如果我们需要根据条件向元素添加或移除类，可以使用条件语句和 addClass 或 removeClass 方法。比如，如果我们需要根据一个变量 isActive 的值来添加或移除类，可以这样写：

if ( isActive ) {
    $( "div" ).addClass( "active foo" ).removeClass( "inactive" );
} else {
    $( "div" ).removeClass( "active foo" ).addClass( "inactive" );
}

这个代码片段会根据 isActive 变量的值，向元素添加或移除 active, foo 和 inactive 三个类名。

删除多个类

在jQuery中，我们可以使用 removeClass 方法一次性删除多个类。这个方法接受一个参数，参数是要删除的类名，可以是一个字符串或者以空格分隔的多个字符串。

假设我们有一个div元素，需要删除两个类名，分别是foo和bar。我们可以这样写：

$( "div" ).removeClass( "foo bar" );

这个方法会从所有匹配元素删除这两个类。

如果我们需要根据条件向元素添加或移除类，可以使用条件语句和 addClass 或 removeClass 方法。比如，如果我们需要根据一个变量 isActive 的值来添加或移除类，可以这样写：

if ( isActive ) {
    $( "div" ).addClass( "active" ).removeClass( "inactive foo" );
} else {
    $( "div" ).addClass( "inactive foo" ).removeClass( "active" );
}

这个代码片段会根据 isActive 变量的值，向元素添加或移除 active, foo 和 inactive 三个类名。