JavaScriptのCloneNode()メソッドの使い方は？

1年 ago
綾乃, 一希
1 minute

cloneNode()メソッドは、JavaScriptに記述された関数のひとつです。既存の要素ノードをコピーし、DOMに挿入するために使用できます。

cloneNode()メソッドは、deepとeventsの2つのオプションパラメータを持ちます。deepパラメータは、要素ノードの子ノードをディープコピーするかどうかを示し、デフォルトではfalse（つまり、要素自体のみをコピーし、子ノードはコピーしません）。eventsパラメータは、要素ノードのイベントリスナーをコピーするかどうかを示し、デフォルトではfalse（つまり、イベントリスナーをコピーしません）。

cloneNode()メソッドの基本的な文法は次のとおりです。

node.cloneNode(deep);

node はコピーする要素ノード、deep は子のノードを再帰的にコピーするかどうかを示すオプション引数です。

たとえば、div要素ノードをcloneNode()メソッドを使用して複製し、DOMに挿入する場合、コードは次のようになります。

var originalDiv = document.getElementById("originalDiv");
var cloneDiv = originalDiv.cloneNode(true);
document.body.appendChild(cloneDiv);

「originalDiv」というIDを持つ要素ノードをgetElementById()メソッドで取得し、cloneNode()メソッドでディープコピーを作成し、appendChild()メソッドでbody要素に追加します。

cloneNode()メソッドは要素ノードにのみ使用可能で、テキストノードや属性ノードには使用できないことに注意してください。テキストノードや属性ノードを複製する場合は、それぞれのメソッドを使用します。テキストノードを複製する場合はcloneNode()メソッド、属性ノードを複製する場合はcloneNode()メソッドを使用します。

bannerAds