Könnten Sie sich bitte dieses jsFiddle-Beispiel ansehen und mir sagen, warum die Zahl "11" eher alarmiert ist als "5" ( die Anzahl der <li>
Elemente)?
Von jsFiddle:
Der childNodes
gibt abhängig vom verwendeten Browser die Textknoten sowie die Tags zurück, die untergeordnete Elemente des übergeordneten Knotens sind. Technisch gesehen wird das Leerzeichen zwischen den <li>
Tags ebenfalls zu childNodes
gezählt.
Um zu vermeiden, sie zu verarbeiten, können Sie überprüfen, dass nodeType != 3
. Hier ist eine Liste der Knotentypen.
Sie haben Textknoten dort.
Sie können sie beim Iterieren mit ... überspringen.
%Vor%jsFiddle .
Alternativ könnten Sie das auch auf eine funktionalere Art tun ...
%Vor%jsFiddle .
Sie müssen es in ein richtiges Array konvertieren, um die Methode filter()
zu verwenden. childNodes
-Eigenschaft gibt ein NodeList
-Objekt zurück.
Textknoten sind in der Anzahl der untergeordneten Knoten enthalten. Um den richtigen Wert zu erhalten, müssen Sie Textknoten entfernen oder sicherstellen, dass sie nicht in Ihrem Code enthalten sind. Jeder Leerraum zwischen Code wird als Leerzeichen und als Textknoten betrachtet. Ihre Anzahl entspricht also der Gesamtzahl der Textknoten.
Ich habe eine Lösung dafür zusammengestellt, die mir gefällt. (Ich habe die Idee von diesem Blogpost .)
1) Zuerst erhalte ich die Anzahl der untergeordneten Elementknoten mit:
%Vor%2) Dann habe ich eine Funktion geschrieben, die jeden untergeordneten Elementknoten nach Indexnummer zurückgibt. Ich tat dies, indem ich firstElementChild und nextElementSibling in einer for-Schleife verwendete.
%Vor%Dies gibt das untergeordnete Element zurück, das ich für alles brauche, was ich daraus ziehen möchte. Es überspringt das Problem, wenn childNodes all die verschiedenen Knoten neu abstimmt, die nicht hilfreich sind, wenn nur die Elemente analysiert werden sollen. Ich bin mir sicher, dass jemand, der erfahrener ist als ich, das aufräumen könnte. Aber ich fand das so hilfreich, dass ich es veröffentlichen musste.
Verwenden Sie stattdessen obj.children.
%Vor%Der Unterschied zwischen diesen untergeordneten und untergeordneten Knoten besteht darin, dass untergeordnete Knoten alle Knoten enthalten, einschließlich Textknoten und Kommentarknoten, während untergeordnete Knoten nur Elementknoten enthalten. von w3schools.
Tags und Links javascript html