Die Funktion scheint die Node , die den angegebenen Wert enthält, nicht zu löschen, es sei denn, sie ist der erste Wert (in diesem Fall 'Äpfel'). Die for-Schleife muss auch vor dem Löschen jeder Art zweimal ausgeführt werden. Warum ist das so?
Das entsprechende HTML:
%Vor% childNodes gibt eine Liste von allen untergeordneten Knoten zurück. Dazu gehören Textknoten . Zwischen jedem Element <li> haben Sie einen Textknoten, der Leerzeichen und einen Zeilenumbruch enthält. Also gibt childNodes eine Liste von 9 Knoten zurück, aber Sie nehmen eine Liste von 4 Knoten an ( document.getElementsByClassName('fruit').length ).
Sie könnten .children verwenden anstelle von .childNodes . .children gibt eine Liste von nur Elementknoten zurück. Oder noch besser, verwenden Sie elements , da Sie das gerade durchlaufen.
Sie müssen auch aufhören zu iterieren, nachdem Sie einen Knoten entfernt haben, sonst versuchen Sie, auf eine Position zuzugreifen, die nicht mehr existiert.
Es gibt noch andere Dinge, die verbessert werden könnten (z. B. warum man checker nicht einen tatsächlichen booleschen Wert zuweist), aber sie sind nicht mit Ihrer Frage verbunden.
Das hört sich vielleicht verrückt an, aber Chrome scheint Ihre HTML-Liste ungeordnet in folgende Punkte zu zerlegen:
%Vor%Im Wesentlichen scheint es, dass Sie für jede neue Zeile innerhalb des Tags einen Textknoten in Ihrer ungeordneten Liste erstellen. Dies erklärt auch, warum das Löschen erst erfolgt, nachdem Sie die Funktion ein zweites Mal aufgerufen haben - sie löscht zuerst den Textknoten und löscht dann das eigentliche Element beim zweiten Versuch.
Einfaches Konvertieren Ihres HTML in die folgende Form löst das Problem (ist aber nicht sehr hübsch):
%Vor%Es gibt einige Problemumgehungen, die Sie ausprobieren können. Beispielsweise könnten Sie stattdessen versuchen, die Methode childNode.remove () zu verwenden. obwohl nicht alle Browser dies unterstützen.
Alternativ könnte auch so etwas funktionieren:
%Vor% hier ist das Problem in myList.removeChild(myList.childNodes[ (counter) ]); , weil myList.childNodes Knoten 8 Werte anstelle von 4 zurückgibt. Wir haben Elemente Array mit 4 Knoten, daher liefert das Entfernen von Elementen Array ein richtiges Ergebnis
Probieren Sie das unten stehende Code-Snippet aus,
%Vor% myList ist ein Array von li element, also ist removeChild auf myList logisch nicht korrekt.
Auch myList.childNodes macht hier keinen Sinn.
Versuchen Sie
%Vor%Tags und Links javascript dom