js循环复制一个div

Posted 無玑小姐

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js循环复制一个div相关的知识，希望对你有一定的参考价值。

<html> 
<head> 
<title>Test of cloneNode Method</title> 
<script type="text/javascript" src="test.js"></script> 
</head> 
<body> 
<div id="main"> 
<div id="div-0"> 
<span>Cloud018 said, </span> 
<span>"Hello World!!!"</span> 
</div> 
</div> 
</body> 
</html> 

// test.js 
window.onload = function () { 
var sourceNode = document.getElementById("div-0"); // 获得被克隆的节点对象 
for (var i = 1; i < 5; i++) { 
var clonedNode = sourceNode.cloneNode(true); // 克隆节点 
clonedNode.setAttribute("id", "div-" + i); // 修改一下id 值，避免id 重复 
sourceNode.parentNode.appendChild(clonedNode); // 在父节点插入克隆的节点 
} 
}

原地址:https://zhidao.baidu.com/question/1574784863775980300.html

以上是关于js循环复制一个div的主要内容，如果未能解决你的问题，请参考以下文章

JS代码中div的复制怎么实现

如何使用事件侦听器来加载动画片段的循环

用JS修饰div做一个用循环的方式做一个正方形，长方形，三角形 如何写？

如何将 ngFor 循环的索引值传递给组件？ [复制]

js循环点击div事件

vscode代码片段生成vue模板