Node: cloneNode() Methode
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Die cloneNode()-Methode des Node-Interfaces
gibt ein Duplikat des Knotens zurück, auf dem diese Methode aufgerufen wurde.
Ihr Parameter bestimmt, ob auch der im Knoten enthaltene Unterbaum geklont wird oder nicht.
Das Klonen eines Knotens kopiert alle seine Attribute und deren Werte,
einschließlich intrinsischer (inline) Listener. Es kopiert nicht Event-Listener, die
mit addEventListener() hinzugefügt wurden,
oder solche, die zu Eigenschaften von Elementen zugewiesen sind (z. B., node.onclick = someFunction).
Darüber hinaus wird bei einem <canvas>-Element das gemalte Bild nicht kopiert.
Warnung:
cloneNode() kann dazu führen, dass Element-IDs in einem Dokument doppelt vorkommen!
Wenn der ursprüngliche Knoten ein id-Attribut hat und der Klon
im selben Dokument platziert wird, sollten Sie die ID des Klons ändern, damit sie
eindeutig ist.
Auch name-Attribute sollten möglicherweise geändert werden,
abhängig davon, ob doppelte Namen erwartet werden.
Um einen Knoten zu klonen und in ein anderes Dokument einzufügen, verwenden Sie
Document.importNode() stattdessen.
Syntax
cloneNode()
cloneNode(deep)
Parameter
deepOptional-
Wenn
true, werden der Knoten und sein gesamter Unterbaum, einschließlich Text, der sich in untergeordnetenText-Knoten befinden kann, ebenfalls kopiert.Wenn
falseoder weggelassen, wird nur der Knoten geklont. Der Unterbaum, einschließlich jeglichen Textes, den der Knoten enthält, wird nicht geklont.Beachten Sie, dass
deepkeine Auswirkungen auf leere Elemente hat, wie die<img>- und<input>-Elemente.
Rückgabewert
Der neue geklonte Node.
Der geklonte Knoten hat keinen Elternteil und ist nicht Teil des Dokuments,
bis er zu einem anderen Knoten hinzugefügt wird, der Teil des Dokuments ist,
unter Verwendung von Node.appendChild() oder einer ähnlichen Methode.
Beispiel
let p = document.getElementById("para1");
let p_prime = p.cloneNode(true);
Spezifikationen
| Specification |
|---|
| DOM # ref-for-dom-node-clonenode① |
Browser-Kompatibilität
Loading…