JS中创建、添加、删除节点

最新推荐文章于 2023-09-06 13:48:57 发布

慧钰鑫

最新推荐文章于 2023-09-06 13:48:57 发布

阅读量1.2k

点赞数 3

文章标签： javascript

本文链接：https://blog.csdn.net/XXH3L/article/details/120479427

版权

createElement()：创建节点

appendChild()：添加节点（还有一个很相似的 inertBefore()：插入节点，两个参）

removeChild()：删除节点

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 创建，添加，删除节点 -->
		<div></div>
	</body>
	<script type="text/javascript">
		var div=document.querySelector("div");//获取需要添加节点的盒子
		// 声明一个变量来存储创建的节点元素
		var createImg=document.createElement("img");//创建img图片标签
		// img标签比较特殊，可以直接添加图片路径
		createImg.src="https://img2.baidu.com/it/u=611935978,2550803864&fm=26&fmt=auto";
		// 将创建好的img标签元素添加到需要添加的节点的盒子中
		div.appendChild(createImg);
		// 删除在div盒子中创建的节点
		// div.removeChild(createImg);
		
		//insertBefore(newnode,existingnode)插入元素，两个参数，第一个参数时需要插入的新元素，第二个参数是指定插在某个元素前
	</script>
</html>

慧钰鑫

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
JS中创建、添加、删除节点

createElement()：创建节点appendChild()：添加节点（还有一个很相似的 inertBefore()：插入节点，两个参）removeChild()：删除节点<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 创建，添加，删除节点
复制链接

扫一扫