Node.cloneNode

Übersicht

Gibt ein Duplikat des Knotens, auf dem diese Methode aufgerufen wurde, zurück.

Syntax

var dupNode = node.cloneNode(deep);
node
Der Knoten, welcher dupliziert werden soll.
dupNode
Der duplizierte Knoten.
deep
true wenn die Kindknoten des Knotens ebenfalls dupliziert werden sollen, false wenn nur der Knoten dupliziert werden soll.

Hinweis: In der DOM4 Spezifikation (implementiert in Gecko 13.0 (Firefox 13 / Thunderbird 13 / SeaMonkey 2.10)), ist das Argument deep optional. Es ist dann laut Spezifikation true.

Leider wurde dies in der letzten Spezifikation geändert, sodass der Standardwert nun false ist. Auch wenn es immer noch optional ist, sollte man das Argument deep aus diesen Kompatibilitätsgründen setzen. Ab Gecko 28.0 (Firefox 28 / Thunderbird 28 / SeaMonkey 2.25 / Firefox OS 1.3) warnt die Konsole den Entwickler, wenn das Argument nicht gesetzt ist.

Beispiel

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

Hinweise

Der duplizierte Knoten enthält alle Attribute und deren Werte, aber nicht die Eventlistener welche via addEventListener() oder über die jeweilige Elementeigenschaft (z.B. node.onclick = function) gesetzt wurden. Im Fall eines <canvas>-Elements wird das gezeichnete Bild nicht mitkopiert.

Der mit cloneNode() duplizierte Knoten ist noch nicht Teil des Dokuments und hat keinen Elternknoten bis er mithilfe der Methode Node.appendChild() oder einer anderen vergleichbaren Methode in das Dokument eingefügt wird.

Wenn deep auf false gesetzt ist, werden die Kindknoten nicht mitkopiert. Dies schließt ebenfalls alle Textelemente mit ein, da diese in einem oder mehreren Kindknoten enthalten sind.

Warnung: cloneNode() kann dazu führen dass es die selbe ID im Dokument mehrmals existiert.

Wenn der Originalknoten eine ID hat, sollte diese im dupliziertem Knoten geändert oder gelöscht werden, um Probleme zu vermeiden. Dies sollte auch für das name Attribut überlegt werden.

Um einen Knoten aus einem anderen Dokument zu kopieren sollte die Document.importNode() verwendet werden.

Browserkompatibilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Ja) (Ja) (Ja) (Ja) (Ja)
deep as an optional parameter

Ja

(Standard: false)

13.0 (13.0) ? ?

Yes

(default is false)

Feature Android Chrome für Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Ja) (Ja) (Ja) (Ja) (Ja) (Ja)
deep as an optional parameter ? ? 13.0 (13.0) ? ? ?

Spezifikationen

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: Haftmann, Hativ3, fscholz, herom, pixunil
 Zuletzt aktualisiert von: Haftmann,