HTML DOM cloneNode() 方法
实例
拷贝一个列表项到另外一个列表:
// Get the last <li> element ("Milk") of <ul> with id="myList2"
var itm = document.getElementById("myList2").lastChild;
// Copy the <li> element and its child nodes
var cln = itm.cloneNode(true);
// Append the cloned <li> element to <ul> with id="myList1"
document.getElementById("myList1").appendChild(cln);
var itm = document.getElementById("myList2").lastChild;
// Copy the <li> element and its child nodes
var cln = itm.cloneNode(true);
// Append the cloned <li> element to <ul> with id="myList1"
document.getElementById("myList1").appendChild(cln);
克隆前:
- Coffee
- Tea
- Water
- Milk
克隆后:
- Coffee
- Tea
- Milk
- Water
- Milk
页面下方有更多实例。
定义和用法
cloneNode() 方法创建节点的副本,并返回克隆。
cloneNode() 方法克隆所有属性及其值。
提示: 使用 appendChild() 或 insertBefore() 方法将克隆节点插入文档。
提示: 如果要克隆所有子体(子体),请将 deep 参数值设置为true,否则为false。
浏览器支持
方法 | |||||
---|---|---|---|---|---|
cloneNode() | Yes | Yes | Yes | Yes | Yes |
语法
node.cloneNode(deep)
参数值
参数 | 类型 | 描述 |
---|---|---|
deep | Boolean | 可选。指定是否应克隆节点的所有子体。
|
技术细节
返回值: | Node 节点对象,表示克隆的节点 |
---|---|
DOM 版本 | Core Level 1 Node Object |
更多实例
实例
复制 <div> 元素,包括其所有属性和子元素,并将其附加到文档中:
var elmnt = document.getElementsByTagName("DIV")[0];
var cln = elmnt.cloneNode(true);
document.body.appendChild(cln);
亲自试一试 »
var cln = elmnt.cloneNode(true);
document.body.appendChild(cln);
相关页面
HTML DOM 参考手册: document.adoptNode() 方法
HTML DOM 参考手册: document.importNode() 方法
HTML DOM 参考手册: document.createElement() 方法
HTML DOM 参考手册: document.createTextNode() 方法