在jQuery中，add()方法用于将元素添加到当前匹配的元素集合中。这个方法非常有用，可以帮助我们在操作DOM时更加灵活和高效。在本文中，我将详细介绍add()方法的用法和示例代码。
语法
$(selector).add(selector|element|html|jQueryObject)
selector：要添加到当前元素集合中的选择器字符串。element：要添加到当前元素集合中的DOM元素。html：要添加到当前元素集合中的HTML字符串。jQueryObject：要添加到当前元素集合中的jQuery对象。
示例
1. 添加选择器字符串
<div class="first"></div>
<div class="second"></div>
<script>
$(document).ready(function(){
$(".first").add(".second").css("background-color", "red");
});
</script>在这个示例中，我们首先选中class为"first"的元素，然后使用add()方法添加了class为"second"的元素到当前元素集合中，并将它们的背景颜色设置为红色。
2. 添加DOM元素
-- -------------------- ---- ------- ---- ------------------ ---- ------------------ ------ -------- ----------------------------- --- ---------- - ------------------------------ ------------------------------------------------- --- ---------
在这个示例中，我们首先创建了一个新的div元素，并添加了class为"circle"，然后使用add()方法将这个新元素添加到class为"box"的元素中，并将它们一起添加到class为"container"的元素中。
3. 添加HTML字符串
-- -------------------- ---- ------- ---- ------------------ ---- ------------------ ------ -------- ----------------------------- --- ------- - ----- ------------------------- ---------------------------------------------- --- ---------
在这个示例中，我们创建了一个包含HTML字符串的变量，然后使用add()方法将这个HTML字符串添加到class为"box"的元素中，并将它们一起添加到class为"container"的元素中。
4. 添加jQuery对象
-- -------------------- ---- ------- ---- ------------------ ---- ------------------ ------ -------- ----------------------------- --- ---------- - ------------------------------ --- ----------- - -------------- -------------------------------------------------- --- ---------
在这个示例中，我们首先创建了一个jQuery对象，然后使用add()方法将这个jQuery对象添加到class为"box"的元素中，并将它们一起添加到class为"container"的元素中。
结论
通过add()方法，我们可以方便地将元素添加到当前元素集合中，从而实现更灵活和高效的DOM操作。希望本文对你有所帮助，谢谢阅读！