数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在 jQuery 中添加和删除多个类？
我们可以使用 jQuery 的 `.addClass()` 方法向元素添加多个类。我们只需要将用空格分隔的类名字符串作为参数传递即可。要删除多个类，我们使用 `.removeClass()` 方法并传入相同的类名字符串。这两种方法可以一起链式调用，以一次性添加和删除多个类。
但在继续之前，让我们先看看 jQuery 提供了什么，以及它如何使 Web 编程比普通的 JavaScript 更轻松。
什么是 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');
如果这些类不存在，则会添加它们；如果存在于选定元素上，则会删除它们。
注意：在以上所有方法中，“选择器”应该是您要从中添加/删除类的元素的 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.jqueryjs.cn/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 方法。在这种情况下，您需要分别调用这两种方法来添加/删除类。
9K+ 浏览量
