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 der Node Schnittstelle gibt duplizierten Knoten zurück, auf dem diese Methode aufgerufen wurde. Ihr Parameter steuert, ob der in einem Knoten enthaltene Teilbaum ebenfalls dupliziert wird oder nicht.
Das Klonen eines Knotens kopiert alle seine Attribute und deren Werte, einschließlich der intrinsischen (inline) Listener. Es kopiert nicht die mit addEventListener() hinzugefügten Event-Listener oder diejenigen, die den Eigenschaften des Elements zugewiesen sind (z.B. node.onclick = someFunction). Zusätzlich wird bei einem <canvas>-Element das gemalte Bild nicht kopiert.
Warnung: cloneNode() kann zu doppelten Element-IDs in einem Dokument führen!
Wenn der ursprüngliche Knoten ein id-Attribut hat und der Klon im selben Dokument platziert wird, sollten Sie die ID des Klons ändern, um einzigartig zu sein.
Auch name-Attribute müssen möglicherweise geändert werden, je nachdem, ob doppelte Namen erwartet werden.
Um einen Knoten zu klonen, der in ein anderes Dokument eingefügt werden soll, verwenden Sie Document.importNode().
Syntax
cloneNode() cloneNode(deep) Parameter
deepOptional-
Wenn
true, werden der Knoten und sein gesamter Teilbaum, einschließlich Text, der sich in den untergeordnetenText-Knoten befinden kann, ebenfalls kopiert.Wenn
falseoder weggelassen, wird nur der Knoten geklont. Der Teilbaum, einschließlich jeglichem Text, den der Knoten enthält, wird nicht geklont.Beachten Sie, dass
deepkeine Wirkung auf void elements, wie die<img>- und<input>-Elemente hat.
Rückgabewert
Der neue geklonte Node. Der geklonte Knoten hat keinen Elternknoten und ist nicht Teil des Dokuments, bis er einem anderen Knoten hinzugefügt wird, der Teil des Dokuments ist, unter Verwendung von Node.appendChild() oder einer ähnlichen Methode.
Beispiel
const p = document.getElementById("para1"); const p2 = p.cloneNode(true); Spezifikationen
| Specification |
|---|
| DOM> # ref-for-dom-node-clonenode①> |