Heim > häufiges Problem > Clonenode-Nutzung

Clonenode-Nutzung

zbt
Freigeben: 2023-11-24 10:51:06
Original
1590 Leute haben es durchsucht

In JavaScript ist cloneNode() eine Methode zum Kopieren von Knoten. Kann zum Kopieren von Elementknoten in HTML-Dokumenten verwendet werden. Sie können auswählen, ob alle untergeordneten Knoten des Knotens kopiert werden sollen.

Clonenode-Nutzung

In JavaScript ist cloneNode() eine Methode zum Kopieren von Knoten. Es kann zum Kopieren von Elementknoten in einem HTML-Dokument verwendet werden, und Sie können auswählen, ob alle untergeordneten Knoten des Knotens kopiert werden sollen. Die cloneNode()-Methode ist Die von DOM (Document Object Model) bereitgestellte Methode hat folgende grundlegende Verwendung:

var originalNode = document.getElementById("originalElement");
var clonedNode = originalNode.cloneNode(true);
Nach dem Login kopieren

Im obigen Code originalNode Stellt den ursprünglichen zu kopierenden Knoten dar, bei dem es sich um ein beliebiges HTML-Element handeln kann. Der Parameter true in cloneNode(true) bedeutet, dass der Knoten und alle seine untergeordneten Knoten kopiert werden. Wenn false übergeben wird, wird nur der Knoten selbst kopiert.

Es ist zu beachten, dass die cloneNode()-Methode nur die Attribute des Elements selbst und aller seiner untergeordneten Elemente kopiert, jedoch nicht die Ereignis-Listener oder Daten, die dem ursprünglichen Element hinzugefügt wurden. Gleichzeitig wird der kopierte Knoten vom Dokumentenfluss getrennt, was bedeutet, dass es sich um eine völlig unabhängige Kopie im Speicher handelt. Jede Operation am kopierten Knoten hat keine Auswirkungen auf den ursprünglichen Knoten.

Hier ist ein umfassenderes Beispiel, das die Verwendung von cloneNode() demonstriert:

<!DOCTYPE html>
<html>
<body>
<div id="original">Original Node
  <span>Subnode 1</span>
  <span>Subnode 2</span>
</div>
<button onclick="cloneElement()">Clone Node</button>
<script>
function cloneElement() {
  var originalNode = document.getElementById("original");
  var clonedNode = originalNode.cloneNode(true);
  clonedNode.id = "cloned"; // 修改克隆节点的id属性
  document.body.appendChild(clonedNode);
}
</script>
</body>
</html>
Nach dem Login kopieren

Klicken Sie im obigen Beispiel auf „Knoten klonen“. Mit der Schaltfläche wird der ursprüngliche Knoten geklont und am Ende des Dokuments hinzugefügt. Sie können dieses Beispiel in einem Browser öffnen und auf die Schaltfläche klicken, um einen Klon des ursprünglichen Knotens anzuzeigen, der der Seite hinzugefügt wurde. Die Methode

cloneNode() ist ein sehr nützliches Tool, das uns dabei helfen kann, Elementknoten in JavaScript dynamisch zu erstellen und zu verwalten, ohne den ursprünglichen Knoten zu beeinträchtigen.

Das obige ist der detaillierte Inhalt vonClonenode-Nutzung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage