jQuery: Elemente, Bilder, Klassen etc zählen

Jeder jQuery-Selektor ist auch ein Array der zugehörigen Elemente und besitzt die Eigenschaft "length". Dies können wir uns zu Nutze machen und dafür verwenden, die Anzahl bestimmter Elemente einer Internetseite zu bestimmen.

Mit dieser Methode ist eigentlich alles möglich zu zählen, was wir mit jQuery auswählen können: die Anzahl der Bilder, die Anzahl der Überschriften, die Anzahl der p-Elemente, die Anzahl der Links, die Anzahl der Elemente mit einer bestimmten ID oder Klasse, andere kompliziertere kombinierte Konstrukte und vieles mehr.

Schauen wir uns dazu zunächst ein einfaches Beispiel an:

var anzahl = $('img').length;

alert("Die Seite enthält " + anzahl + " Bilder.");

Mit dem Selektor $('img') wählen wir alle Bilder der aktuellen Seite aus (Bilder sind in HTML mit dem "img"-Tag gekennzeichnet, sofern sie nicht zum Beispiel über CSS-Eigenschaften als Hintergrundbild eines Elements über "background-image" oder dergleichen eingebettet sind). Nach der Ermittlung der Anzahl geben wir eine alert()-Meldung aus, die uns darüber informiert, wie viele Bilder die Seite enthält.

Weitere Beispiele

Schauen wir uns einige weitere Beispiele für die Ermittlung der Anzahl von Elementen mit einer bestimmten ID oder bestimmten Klassen an:

var anz1 = $('.a').length;
var anz2 = $('#b').length;
var anz3 = $('.c.d').length;

Hier ermitteln wir zunächst die Anzahl der Elemente mit der Klasse "a", dann alle Elemente mit der ID "b" und schließlich alle Elemente, die die Klassen "c" und "d" zugewiesen haben.

Es lässt sich jeder beliebige jQuery-Selektor verwenden.

Prüfen ob ein bestimmtes Element vorhanden ist

Auch falls uns nicht die exakte Anzahl eines bestimmten Elements oder einer bestimmten Elementgruppe interessiert, sondern die Frage danach, ob eines dieser Elemente überhaupt auf unserer Internetseite vorhanden ist, können wir mit der hier vorgestellten Methode arbeiten. Wir müssen lediglich prüfen ob .length 0 oder größer als 0 ist, schon wissen wir, ob es Elemente dieses Typs gibt oder nicht.