jquery删除节点

最新推荐文章于 2023-02-23 19:17:10 发布

this_is_art_of_code

最新推荐文章于 2023-02-23 19:17:10 发布

阅读量8.7k

点赞数 3

分类专栏： jquery 文章标签： jquery 删除节点

本文链接：https://blog.csdn.net/qq_28596151/article/details/80426694

版权

jquery 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

jquery提供了3中删除节点的方法。分别是remove()、detach()、empty()。

1、remove()方法

1.1、$(selector).remove()的使用

解释：删除匹配到的文档中的元素节点，同时返回删除的节点引用。我们可以在后面的业务如果需要继续使用。

1.2、$(selectorA).remove(selector)的使用

解释：需要先匹配需要删除的元素节点，然后这些节点需要满足我们传入方法中的条件，便可以删除。

该方式也会返回引用，不过他返回的是$(selectorA)选择器匹配到的元素对象数组。

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery的dom操作</title>
	<script src="../jquery-1.3.1.js"></script>
</head>
<body>
	<p title="选择你喜欢的水果">你最喜欢的水果是?</p>
	<ul> 
		<li title="苹果">苹果</li>
		<li title="橘子title">橘子</li>
		<li title="菠萝">菠萝</li>
		<li title="菠萝2">菠萝2</li>
		<li title="菠萝3">菠萝3</li>
	</ul>
</body>
<script> 
	$(function(){
		//删除ul节点中的第四个li元素，并返回删除的节点引用。
		//var $li = $("ul li:eq(3)").remove();
		//$("ul").after($li);
		
		var $li = $("ul li").remove("li[title*='菠萝']");
		alert($li.length);//5
		//$li.insertAfter("ul");
		$("ul").after($li);
	});
</script>
</html>

2、detach()方法

detach（）方法和remove（）方法一样收拾从dom中去掉所有匹配到的元素。但是，detach()方法不会把匹配到的元素从jquery对象中删除，因为可以在将来再次使用这些元素。还有一点就是，detach()方法去掉匹配的元素后，这些匹配的元素所绑定的事件以及数据都不会被删除，即被保留下来了。

3、empty()方法

empty()方法可以清空指定元素的所有后代元素节点，保留的结果就是只剩下指定标签。

注意：删除的是指定标签的所有后代元素节点，本身不会删除。

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery的dom操作</title>
	<script src="../jquery-1.3.1.js"></script>
</head>
<body>
	<p title="选择你喜欢的水果">你最喜欢的水果是?</p>
	<ul> 
		<li title="苹果">苹果</li>
		<li title="橘子title">橘子</li>
		<li title="菠萝">菠萝</li>
		<li title="菠萝2">菠萝2</li>
		<li title="菠萝3">菠萝3</li>
	</ul>
</body>
<script> 
	$(function(){
		$("ul li").empty();
	});
</script>
</html>

this_is_art_of_code

关注

3
点赞
踩
15

收藏

觉得还不错? 一键收藏
0
评论
jquery删除节点

jquery提供了3中删除节点的方法。分别是remove()、detach()、empty()。1、remove()方法1.1、$(selector).remove()的使用解释：删除匹配到的文档中的元素节点，同时返回删除的节点引用。我们可以在后面的业务如果需要继续使用。1.2、$(selectorA).remove(selector)的使用解释：需要先匹配需要删除的元素节...
复制链接

扫一扫