HTML DOM cloneNode()メソッド
例
<li>要素をあるリストから別のリストにコピーします。
// 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);
クローンを作成する前に:
- Coffee
- Tea
- Water
- Milk
クローン作成後:
- Coffee
- Tea
- Milk
- Water
- Milk
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
cloneNode()メソッドはノードのコピーを作成し、クローンを返します。
cloneNode()メソッドは、すべての属性とその値を複製します。
ヒント: appendChild()またはinsertBefore()メソッドを使用 して、複製されたノードをドキュメントに挿入します。
ヒント:すべての子孫(子)のクローンを作成する場合は、 deepパラメーター値をtrueに設定します。それ以外の場合は、falseに設定します。
ブラウザのサポート
Method | |||||
---|---|---|---|---|---|
cloneNode() | Yes | Yes | Yes | Yes | Yes |
構文
node.cloneNode(deep)
パラメータ値
Parameter | Type | Description |
---|---|---|
deep | Boolean |
Optional. Specifies whether all descendants of the node should be cloned.
|
技術的な詳細
戻り値: | 複製されたノードを表すNodeオブジェクト |
---|---|
DOMバージョン | コアレベル1ノードオブジェクト |
その他の例
例
すべての属性と子要素を含む<div>要素をコピーし、ドキュメントに追加します。
var elmnt = document.getElementsByTagName("DIV")[0];
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()メソッド