nodeClone()

<script type="text/javascript">

	window.onload=function()
	{

		var sourse=document.getElementById('div0')
		for(var i=1;i<5;i++)
		{
			var clone=sourse.cloneNode(true);
			clone.setAttribute('id','div'+i);
			sourse.parentNode.appendChild(clone);
		}
	}
</script>
</head>


<div id="div0">
	<div><p>fdfdfff</p></div>
	<span>dfdf</span>
</div>

[img]http://dl2.iteye.com/upload/attachment/0108/3388/0d7fccb8-2232-35df-83e2-39d3cab982ea.png[/img]

cloneNode(true);为true时克隆子代所有元素 false时只copy自己

注意
但是无论是浅拷贝还是深拷贝source都不会将自己的css属性克隆给clone

css代码
#div0{display: inline-block; width: 200px;}

效果如图
[img]http://dl2.iteye.com/upload/attachment/0108/3402/083477a6-7bcb-3ccb-b967-a1ce4b8800f8.png[/img]

[img]http://dl2.iteye.com/upload/attachment/0108/3404/59e8d656-a808-3f8c-840c-4c874b5bfb8d.png[/img]

解决方法
if ( node.nodeType === 1 ) {
style = window.getComputedStyle( node );

styleKeys.forEach( function ( prop ) {
clone.style[ prop ] = style[ prop ];
});
这样clone就具有了node的css属性