jQuery ist eine weit verbreitete JavaScript-Bibliothek, die komplexe DOM-Manipulationen, Animationen und AJAX-Anfragen mit wenigen Zeilen Code ermöglicht.
Was bedeutet das?
jQuery wurde 2006 von John Resig veröffentlicht und ist bis heute eine der am häufigsten verwendeten JavaScript-Bibliotheken im Web. Das Kernprinzip ist einfach: „Write less, do more.“ Was mit nativem JavaScript mehrere Zeilen Code erfordert, lässt sich mit jQuery oft in einer einzigen Zeile ausdrücken. Das Selektor-System lehnt sich an CSS an: $('.meine-klasse').hide() versteckt alle Elemente mit der CSS-Klasse meine-klasse.
jQuery abstrahiert Unterschiede zwischen Browsern weg. In der Frühzeit des Webs verhielten sich verschiedene Browser bei JavaScript-APIs unterschiedlich, was aufwendige Fallunterscheidungen erforderte. jQuery übernahm diese Arbeit und stellte eine einheitliche API zur Verfügung. Obwohl moderne Browser heute weitgehend einheitliche APIs implementieren, ist jQuery in vielen bestehenden Projekten und Plugins weiterhin fest verankert.
WordPress liefert jQuery im Kern mit und registriert es als „jquery“ über das Script-API. Plugins und Themes sollen jQuery über wp_enqueue_script('jquery') einbinden, statt es selbst zu laden. Damit wird sichergestellt, dass stets dieselbe Version verwendet wird und kein Konflikt entsteht.
Beispiel aus der Praxis
Sie haben auf Ihrer WordPress-Website ein Kontaktformular. Das Plugin verwendet jQuery, um das Formular zu validieren: Fehlt die E-Mail-Adresse, zeigt ein rotes Hinweisfeld direkt unter dem entsprechenden Feld an. Gleichzeitig sendet das Formular die Daten per AJAX im Hintergrund, sodass die Seite nach dem Absenden nicht komplett neu geladen wird. Beides gelingt mit jQuery in wenigen Zeilen. Im WordPress-Backend ist jQuery ebenfalls aktiv: Das Menü-System, der Medien-Uploader und viele Metabox-Interaktionen basieren auf jQuery-Code, der seit Jahren zuverlässig funktioniert.
Tipp aus der Praxis
WordPress lädt jQuery standardmäßig im Kompatibilitätsmodus (jQuery.noConflict()). Das bedeutet, das globale $-Kürzel ist nicht automatisch verfügbar. Wenn Sie eigenen jQuery-Code in WordPress schreiben, verwenden Sie stattdessen entweder jQuery ausgeschrieben oder kapseln Sie Ihren Code in einem sofort ausgeführten Funktionsausdruck: (function($) { /* Ihr Code */ })(jQuery);. So steht $ innerhalb der Funktion für jQuery zur Verfügung, ohne den globalen Namensraum zu beeinflussen. Ignorieren Sie diesen Kompatibilitätsmodus, führt das zu schwer nachvollziehbaren Fehlermelungen wie „$ is not a function“.