js删除元素

最新推荐文章于 2024-01-14 21:38:44 发布

touchandy

最新推荐文章于 2024-01-14 21:38:44 发布

阅读量1.3k

点赞数

分类专栏： jquery

本文链接：https://blog.csdn.net/touchandy/article/details/12619497

版权

jquery 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>删除元素</title>
	<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
	<style type="text/css">
		*{ margin:0px; padding: 0px;}
		div{ width: 200px; height: 100px; background: red;}
	</style>
</head>
<body>
<p>this is first graph</p>
<p>this is second graph</p>
<button class="remove">点击删除段落p</button>
<p>this is third graph</p>
<div>
	<p>this is first graph</p>
	<p>this is second graph</p>
	<button class="empty">点击删除段落p</button>
	<p>this is third graph</p>
</div>
	<script type="text/javascript">
		$(function(){
			//jquery有；两种删除元素的方法remove()和empty()
			
			//1.1 remove()方法
			//从DOM中删除所有匹配的元素,同时返回被删除的元素，因此可以把删除的元素保存在变量中付给其他元素
			
			
			$(".remove").click(function(){
				var $_p = $("p").remove(); //删除段落文本
				//$("body").append($_p);
			});
			
			//1.2 empty()方法
			// empty()方法删除匹配的元素集合中的所有子节点
			$(".empty").click(function(){
				$("div").empty();  //div下的所有内容都将被删除，但是div本身还在
			});
		
		});
		

	</script>
</body>
</html>

touchandy

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js删除元素

删除元素 *{ margin:0px; padding: 0px;} div{ width: 200px; height: 100px; background: red;} this is first graphthis is second graph点击删除段落pthis is third graph this is first graph this is s
复制链接

扫一扫

专栏目录