getElementsByClassName vs querySelectorAll

8

wenn ich

benutze %Vor%

alles funktioniert gut. Alle Knoten ändern ihre Klassen. Aber mit gEBCN:

%Vor%

Ich bekomme einen Fehler. Code springt irgendwann aus der Schleife heraus und beendet den Job nicht mit msg "kann className von null nicht setzen".
Ich verstehe, dass dies statische vs Live-Nodelist Problem ist (denke ich), aber da GEBCN viel schneller ist und ich durch riesige Liste von Knoten (Baum) durchlaufen muss, würde ich gerne getElementsByClassName verwenden Gibt es etwas, was ich tun kann, um mit gEBCN zu bleiben und nicht gezwungen werden, querySelectorAll zu verwenden?

    
Wolf War 25.09.2014, 20:49
quelle

2 Antworten

8

Gehe über die Liste rückwärts , dann verschwinden die Elemente vom Ende (wo du nicht mehr hinschaust).

%Vor%

Beachten Sie jedoch, dass IE 8 querySelectorAll unterstützt, aber nicht getElementsByClassName , daher möchten Sie vielleicht querySelectorAll für eine bessere Browserunterstützung bevorzugen.

Alternativ entfernen Sie nicht die vorhandene Klasse:

%Vor%     
Quentin 25.09.2014, 20:50
quelle
14

Das liegt daran, dass HTMLCollection , das von getElementsByClassName zurückgegeben wird, live ist.

Das bedeutet, dass wenn Sie "class" zu der classList eines Elements hinzufügen, diese in temp erscheint.

Das Gegenteil ist auch richtig: Wenn Sie die "class" -Klasse eines Elements in temp entfernen, ist es nicht mehr da.

Daher ändert das Ändern der Klassen die Auflistung neu und ändert ihre Länge. Das Problem besteht also darin, dass Sie es iterieren, bevor Sie seine Länge erfassen, ohne die Änderungen der Indizes zu berücksichtigen.

Um dieses Problem zu vermeiden, können Sie:

  • Verwenden Sie eine nicht live Sammlung. Zum Beispiel

    %Vor%
  • Konvertiere das live HTMLCollection in ein Array. Zum Beispiel mit einem dieser

    %Vor%
  • Rückwärts laufen. Siehe beispielsweise @ Quentins Antwort .

  • Berücksichtigen Sie die Änderungen der Indizes. Zum Beispiel

    %Vor% %Vor%
Oriol 25.09.2014 20:57
quelle

Tags und Links