jQueryDom操作之删除节点

最新推荐文章于 2022-12-05 18:11:26 发布

我叫阿狸猫

最新推荐文章于 2022-12-05 18:11:26 发布

阅读量1.2k

点赞数

分类专栏： Jquery

本文链接：https://blog.csdn.net/world_java/article/details/9627789

版权

Jquery 专栏收录该内容

27 篇文章 0 订阅

订阅专栏

删除节点：

remove():

从 DOM 中删除所有匹配的元素, 传入的参数用于根据 jQuery 表达式来筛选元素. 当某个节点用 remove() 方法删除后, 该节点所包含的所有后代节点将被同时删除. 这个方法的返回值是一个指向已被删除的节点的引用.
empty():

清空节点 – 清空元素中的所有后代节点(不包含属性节点).

练习：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ddd</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<script language="JavaScript" src="../js/jquery-1.4.2.js"></script>
	<style type="text/css">
		 	div,span{
			    width: 140px;
			    height: 140px;
			    margin: 20px;
			    background: #9999CC;
			    border: #000 1px solid;
				float:left;
			    font-size: 17px;
			    font-family:Roman;
			}
			
			div.mini{
			    width: 30px;
			    height: 30px;
			    background: #CC66FF;
			    border: #000 1px solid;
			    font-size: 12px;
			    font-family:Roman;
			}
			
			div.visible{
				display:none;
			}
	 </style>
	 <!--引入jquery的js库-->
    
	</head>
	 
	<body>
		 <ul id="city">
		 	 <li id="bj" name="beijing">北京</li>
			 <li id="tj" name="tianjin">天津</li>
			 <li id="cq" name="chongqing">重庆</li>
		 </ul>
		<p class="hello">Hello</p> how are <p>you?</p> 
	</body>
<script language="JavaScript">
   //删除<li id="bj" name="beijing">北京</li>
   

   //删除所有的子节点   清空元素中的所有后代节点(不包含属性节点).
  
   //测试
</script>
</html>

答案：

<script language="JavaScript">
   //删除<li id="bj" name="beijing">北京</li>
   $("#bj").remove();

   //删除所有的子节点   清空元素中的所有后代节点(不包含本身的属性节点,而子类的属性节点删除).
  	$("#city").empty();
   //测试
	alert($("#city").attr("id"));
</script>