jQuery.find() – Auffinden von Elementen im DOM

Mit jQuery.find() können Sie gezielt nach bestimmten HTML-Tags, Klassen oder IDs suchen, ohne aufwendige manuelle Iterationen durchführen zu müssen.

Was ist die jQuery.find()-Methode?

Indem Sie jQuery.find() auf ein bestimmtes jQuery-Objekt anwenden, können Sie Elemente innerhalb dieses Objekts lokalisieren. Die Suche erfolgt rekursiv. Das bedeutet, dass nicht nur die direkten Kinder von jQuery.find(parent) durchsucht werden, sondern auch alle verschachtelten Elemente im DOM-Baum. Das Ergebnis ist ein neues jQuery-Objekt, das alle gefundenen Elemente enthält. Dieses kann dann manipuliert oder als Grundlage für weitere Operationen verwendet werden. Sie können dem Objekt zum Beispiel eine Klasse mit jQuery.addClass() hinzufügen oder andere Elemente durch jQuery.append() anhängen. Des Weiteren ermöglicht jQuery in WordPress auf einfache Weise Objekte in Ihrem CMS zu finden.

Tipp

Mit Webspace von IONOS erhalten Sie über 50 GB für Ihre Web-Projekte sowie ein kostenloses SSL-Wildcard-Zertifikat. Der günstigste Tarif startet schon ab 7 € monatlich. Zudem haben Sie die Möglichkeit, Ihr Hosting-Paket jederzeit zu erweitern. Bei Fragen oder Problemen steht Ihnen der Experten-Support von IONOS rund um die Uhr zur Verfügung.

Wie sieht die Syntax von jQuery.find() aus?

Die jQuery.find()-Methode hat folgenden Aufbau:

$(selector).find(filter)
jQuery
  • filter: ist optional und dient zur weiteren Filterung der gefundenen Elemente anhand zusätzlicher Selektoren in jQuery, zum Beispiel jQuery.find(class) oder jQuery.find(id)

Wenn Sie mehr über Selektoren, deren Schreibweisen und Funktionen lernen möchten, können Sie einen Blick in unser jQuery-Tutorial werfen.

Tipp

Die IONOS API eröffnet Ihnen die Möglichkeit, Aufgaben und Prozesse automatisiert abzuwickeln. So können Sie Ressourcen erstellen und konfigurieren, ohne auf manuelle Eingriffe angewiesen zu sein. Die autonome Vorgehensweise spart Ihnen dabei nicht nur Zeit, sondern reduziert auch potenzielle Fehler.

Beispiele für die Anwendung von jQuery.find()

Die Vielzahl an Selektoren, die Sie als Filter für die jQuery.find()-Methode verwenden können, wollen wir Ihnen an folgenden Beispielen demonstrieren:

// Suche nach allen <a>-Elementen innerhalb eines <div>-Elements mit der Klasse "container"
$('.container').find('a');
// Suche nach <li>-Elementen innerhalb eines <ul>-Elements mit der ID "myList"
$('#myList').find('li');
// Suche nach allen <input>-Elementen innerhalb eines <form>-Elements und Filtern nach dem Typ "text"
$('form').find('input[type="text"]');
jQuery

Sie können auch weitere Funktionen bequem mit jQuery.find() verknüpfen:

$("div#container").find("button").addClass("selected");
jQuery

Mithilfe von jQuery.find(element) lokalisieren wir in diesem Beispiel alle Buttons im <div>-Element mit der ID „container“ und vergeben diesen die Klasse „selected“.

Tipp

Sie wollen Ihre eigene Webseite oder Applikation schnell online bringen? Deploy Now von IONOS garantiert Ihnen ein einfaches Staging inklusive Vorschau-URL. Mit der benutzerfreundlichen Oberfläche und der automatischen Framework-Erkennung können Sie Ihre Anwendung schnell und unkompliziert einrichten.

War dieser Artikel hilfreich?
Page top