如何在 jQuery 中添加和删除多个类?
我们可以使用 jQuery 的 .addClass() 方法向元素添加多个类。我们只需传递一个以空格分隔的类名字符串作为参数即可。要删除多个类，我们使用 .removeClass() 方法并传入相同的类名字符串。这两种方法可以串联起来，一次性添加和删除多个类。
但在继续之前，让我们先了解一下 jQuery 的功能，以及它如何使 Web 编程比纯 JavaScript 更简单。
什么是 jQuery
jQuery 是一个 JavaScript 库，它简化了操作和遍历 HTML 和 CSS 的过程。
它允许开发人员使用简单的语法轻松地选择、操作和更改网页内容。
jQuery 还提供了丰富的内置方法和事件来处理常见任务，例如表单验证、动画和 AJAX 调用。
它与所有现代浏览器兼容，并广泛应用于 Web 开发。
jQuery 是开源的，拥有庞大的社区支持，可以轻松找到任何问题的解决方案和教程遇到。
方法
jQuery 是一个 JavaScript 库，它简化了操作和遍历 HTML 和 CSS 的过程。
它允许开发人员使用简单的语法轻松地选择、操作和更改网页内容。
jQuery 还提供了丰富的内置方法和事件来处理常见任务，例如表单验证、动画和 AJAX 调用。
它与所有现代浏览器兼容，并广泛应用于 Web 开发。
jQuery 是开源的，拥有庞大的社区支持，可以轻松找到任何问题的解决方案和教程遇到。
现在让我们探索一下添加和删除多个类的方法 -
要在 jQuery 中添加多个类，请使用"addClass"方法并传入一个以空格分隔的类名字符串 -
$(selector).addClass('class1 class2 class3');
要在 jQuery 中删除多个类，请使用"removeClass"方法并传入一个以空格分隔的类名字符串 -
$(selector).removeClass('class1 class2 class3');
或者，您也可以使用"toggleClass"方法一次性添加或删除多个类 -
$(selector).toggleClass('class1 class2 class3');
如果类不存在，则添加;如果类存在于所选元素上，则删除。
注意:在所有上述方法中，"selector"应该是要添加/删除类的元素的 jQuery 选择器。
示例
以下是使用 toggleClass 方法在 jQuery 中添加或删除多个类的完整示例 -
<!DOCTYPE html>
<html>
<head>
<title>Toggle Class</title>
<style>
.red {
color: red;
}
.bold {
font-weight: bold;
}
</style>
</head>
<body>
<div id="myDiv">Hello World</div>
<button id="toggleBtn">Toggle Classes</button>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script>
$(document).ready(function() {
$('#toggleBtn').click(function() {
$('#myDiv').toggleClass('red bold');
});
});
</script>
</body>
</html>
现在，点击按钮将在"myDiv"元素上切换"red"和"bold"类，每次点击都会改变文本的颜色和字体粗细。
您也可以以相同的方式使用 addClass 和 removeClass 方法。在这种情况下，您需要分别调用这两个方法来添加/删除类。
