<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>克隆节点cloneNode()</title>
<!--
node.cloneNode(true);完整克隆节点node及其所有子节点
node.cloneNode()/node.cloneNode(false);只克隆node及其本身的属性;
-->
<style>
#div{
width: 300px;
height: 30px;
background: red;
margin: 20px;
}
</style>
</head>
<body>
<div id="div">我是老div</div>
<script>
var div=document.getElementById("div");//获取div
var newdiv=div.cloneNode(true);//克隆div生成新的
newdiv.innerHTML+=",no,我是克隆的新div";//为新的div添加内容
document.body.insertBefore(newdiv,div);//将新的div放至老div前面
</script>
</body>
</html>