このメソッドを呼んだノードの複製を返します。

文法

var dupNode = node.cloneNode([deep]);

引数	説明
deep	trueにするとノードの子も複製され、falseだと指定されたノードだけの複製になります。
戻り値
dupNode	nodeを複製した新しいノードです。

例

var p = document.getElementById("para1"),
var p_prime = p.cloneNode(true);

注意事項

複製されたノードは、本来備わっているリスナーを含め、複製元の属性や値の全てをコピーします。 addEventListener()、または要素プロパティに割り当てられた(例:node.onclick = fn)イベントリスナーは コピーしません。

cloneNode()によって返される複製されたノードは、appendChild()や類似するメソッドによって documentの一部である他のノードに追加されるまでは、documentの一部ではありません。

もし、deepにfalseが設定されると、子ノードは複製されません。 ノードに含まれるテキストは、1つでも複数でも子テキストノードはいずれも複製されません。

deepをtrueにすると、全サブツリー(テキストなどの、その子テキストノードも含む)もコピーされます。 空ノード(例: <img>、<input>)は、deepがtrueでもfalseでも関係ありません。

警告: cloneNode()は、document内の要素idを複製する可能性があります。

もし、元のノードがidを持ち複製が同じdocument内に配置されるのであれば、 複製されたidは一意の値に修正すべきです。 複製された名前を期待されているかどうかで、名前属性も変更した方が良いかもしれません。

複製したノードを異なるdocumentに追加したい場合は、 .importNode()を代わりに使用します。

ブラウザ互換性

デスクトップ

機能	Chrome	Firefox (Gecko)	IE	Opera	Safari
基本	◯	◯	◯	◯	◯
任意引数 deep	◯ (デフォルトはfalse)	13.0 (13.0)	?	?	◯ (デフォルトはfalse)

モバイル

機能	Android	Chrome for Android	Firefox Mobile	IE Mobile	Opera Mobile	Safari Mobile
基本	◯	◯	◯	◯	◯	◯
任意引数 deep	?	?	13.0 (13.0)	?	?	?

仕様

• DOM Level 2 Core: cloneNode
• DOM Level 3 Core: cloneNode
• DOM4: cloneNode

 Back to top