JS学习-16.删除元素的方法

最新推荐文章于 2024-04-18 20:20:27 发布

立花泷的学习日记

最新推荐文章于 2024-04-18 20:20:27 发布

阅读量987

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/qq_37974765/article/details/121351844

版权

JavaScript DOM操作 removeChild remove 元素删除

关键词由CSDN通过智能技术生成

js 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

删除子级元素 removeChild
删除自身元素 remove

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>删除子级元素</title>
	</head>
	<body>
		<div id='div1'>
			<span>
				123
			</span>
			<span>456</span>
			<span id='span1'>789</span>
		</div>
		<script type="text/javascript">
		/**
		 * removeChild 删除子级元素
		 * remove 删除自身元素
		 */
			allSpan=document.getElementsByTagName('span');//获取所有的span元素
			console.log(allSpan);//打印获取的span
			//div1.removeChild(allSpan[0]);//删除第一个span元素
			//删除所有的span元素
			for(var i=0;i<2;i++){
				div1.removeChild(allSpan[0]);//注意，这里是0，因为当删除第一个，第二个自然就变成了第一个;
			}
			span1.remove();//删除span1元素
		</script>	
	</body>
</html>