Javascript-Methode „removeChild()“ zum Löschen von Knoten und zum Löschen untergeordneter Knoten_Javascript-Fähigkeiten

Im Folgenden erfahren Sie, wie Sie Knoten mithilfe von Javascript „removeChild()“ löschen. Die spezifischen Details lauten wie folgt:

In Javascript gibt es nur eine Methode zum Löschen von Knoten: removeChild().

Die Methode

removeChild() wird verwendet, um einen untergeordneten Knoten des übergeordneten Knotens zu löschen.

Grammatik:

parent.removeChild(thisNode)

Parameterbeschreibung:

参数	说明
thisNode	当前节点，即要删除的节点
parent	当前节点的父节点，即 thisNode.parentNode

Zum Beispiel lautet die Anweisung zum Löschen des Knotens mit der ID="demo":

var thisNode=document.getElementById("demo");
thisNode.parentNode.removeNode(thisNode);

Zum Beispiel Knoten löschen:

<div id="demo">
  <div id="thisNode">点击删除我</div>
</div>
<script type="text/javascript">
document.getElementById("thisNode").onclick=function(){
  this.parentNode.removeChild(this);
}
</script>

Beispieldemonstration:

Es ist ersichtlich, dass Javascript zwar nur eine Methode zum Löschen von Knoten bereitstellt, diese jedoch ausreicht.

ps: JavaScript-Methode zum Löschen untergeordneter Knoten

Der HTML-Code lautet wie folgt:

<div id="f"> 
 <div>a</div> 
 <div>b</div> 
 <div>c</div> 
</div> 

Wenn Sie alle untergeordneten Knoten unter dem f-Knoten löschen möchten, sollte die natürliche und normale Methode, die Ihnen in den Sinn kommt, der folgende Code sein:

var f = document.getElementById("f"); 
var childs = f.childNodes; 
for(var i = 0; i < childs.length; i++) { 
  alert(childs[i].nodeName); 
  f.removeChild(childs[i]); 
} 

Als das Programm ausgeführt wurde, stellten wir fest, dass, egal ob unter Firefox oder IE, nicht alle untergeordneten Knoten vollständig gelöscht werden konnten (der leere Bereich wurde auch in FireFox gelöscht
). Dies liegt daran, dass beim Löschen des untergeordneten Knotens mit Index 0 der ursprüngliche Index natürlich
ist Zu diesem Zeitpunkt wird der Index des Knotens, der 1 ist, zu 0, und zu diesem Zeitpunkt ist die Variable i zu 1 geworden. Wenn das Programm fortfährt, löscht es den Knoten mit dem ursprünglichen Index von 2 und ist jetzt 1. In diesem Das Ergebnis der Ausführung des Programms ist, dass nur der Knoten gelöscht wird. Für die Hälfte der untergeordneten Knoten ist das Ergebnis des Durchlaufens mit for in dasselbe. Möchten Sie alle Knoten normal löschen
Wenn ja, sollten wir von hinten nach vorne löschen, der Code lautet wie folgt:

for(var i = childs.length - 1; i >= 0; i--) { 
  alert(childs[i].nodeName); 
  f.removeChild(childs[i]); 
} 

Wir beginnen mit dem Löschen ab dem maximalen Indexwert und verwenden dabei die abnehmende Methode, damit sich der Index nicht verschiebt oder ändert.