JavaScript 拷貝dom元素

admin發表於2017-11-18
JavaScript

cloneNode()可以克隆指定節點，並返回新的節點物件。

推薦JavaScript cloneNode() 克隆節點一章節，介紹更加詳細。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
obj.cloneNode(boolean)

引數解析:

（1）.obj:要被克隆複製的節點物件。

（2）.boolean:可選，預設為true，深度克隆，元素的所有子節點都會被克隆，為false，只克隆節點本身。

程式碼例項:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title>  
<script type="text/javascript"> 
window.onload=function(){
  var obox=document.getElementById("box");
  var oshow=document.getElementById("show");
  var obt=document.getElementById("bt");
  obt.onclick=function(){
    var newObj=obox.cloneNode();
    oshow.appendChild(newObj);
  }
}
</script>
</head> 
<body>
<div id="box"><input type="button" value="螞蟻部落"/></div> 
<div id="show"></div>
<input type="button" id="bt" value="檢視效果"/>
</body> 
</html>

由於沒有帶引數，則進行深度拷貝，所以div的所有子元素都會被克隆。

相關文章