如何在不使用 jQuery 的 addClass() 方法的情况下为元素添加类?
jqueryweb developmentfront end technology
我们可以使用 .attr() 方法为元素添加类。此方法可用于设置或获取 HTML 元素属性的值。要添加类，我们首先使用 jQuery 选择器选择元素，然后调用 .attr() 方法，传入"class"作为第一个参数，类名作为第二个参数。
首先让我们了解一下 jQuery 是什么。jQuery 是一个 JavaScript 库，它简化了 HTML 文档遍历、事件处理和动画。它允许轻松操作文档对象模型 (DOM)。
它还提供了几种常见 JavaScript 任务的简写方法，例如发出 AJAX 请求。它广泛用于 Web 开发，以创建交互式动态用户界面。它可以轻松地与其他库和框架集成。
方法
在 jQuery 中，您可以使用 addClass() 方法向元素添加类，但也可以使用 attr() 或 prop() 方法向元素添加类。
例如 -
$("#element").attr("class", "new-class");
或
$("#element").prop("class", "new-class");
这将为 ID 为"element"的元素添加"new-class"类。
您还可以使用 += 运算符将多个类名链接在一起
$("#element").attr("class", function(i, origValue){
return origValue + " new-class";
});
示例
这是一个完整的示例，在不删除任何现有类的情况下，将"new-class"类添加到 ID 为"element"的元素 -
<!DOCTYPE html>
<html>
<head>
<title>Adding Class</title>
</head>
<body>
<div id="element" class="existing-class">This is an element</div>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script>
$(document).ready(function(){
$("#element").attr("class", function(i, origValue){
return origValue + " new-class";
});
});
</script>
</body>
</html>
在本例中，我们有一个 HTML 元素，其 ID 为"element"，类名为"existing-class"。文档准备就绪后，我们使用 jQuery 的 $("#element") 选择器选中该元素，并使用 attr() 方法将类名"new-class"添加到该元素的现有类名中。
您可以在浏览器开发工具中查看，该元素的类名应该是"existing-class new-class"。
