|
JQuery
jQuery (auch jQuery Core) ist eine freie JavaScript-Bibliothek, die Funktionen zur DOM-Navigation und -Manipulation zur Verfügung stellt. jQuery ist die meistverwendete JavaScript-Bibliothek.[4] 77 % aller Websites[4] und 69 % der 10.000 meistbesuchten Websites[5] nutzen jQuery (Stand: September 2022). Die Bibliothek wird in vielen Content-Management-Systemen und Webframeworks bereits mitgeliefert, zum Beispiel in Joomla[6], WordPress[7], MediaWiki[8] oder Drupal[9]. GeschichteUrsprünglich sollte die Bibliothek jSelect genannt werden. Da die Domain für diesen Namen schon vergeben war, entschied sich der Entwickler John Resig für den Namen jQuery.[10] Die von John Resig entwickelte Bibliothek wurde im Januar 2006 auf dem Barcamp (NYC) in New York veröffentlicht. Zwischenzeitlich wird die Bibliothek jQuery von der unabhängigen jQuery Foundation fortlaufend weiterentwickelt und um weitere Bibliotheken ergänzt mit JQuery UI, jQuery Mobile, Sizzle Selector Engine und QUnit. Der Erfinder John Resig hat sich inzwischen aus der aktiven Entwicklungsarbeit zurückgezogen und diese an das jQuery Team übergeben, welchem er als Ehrenmitglied weiterhin angehört.[11] Parallele VersionssträngeBis 2016 wurden mit 1.x und 2.x zwei Versionsstränge gepflegt, die sich hinsichtlich der Browserkompatibilität unterscheiden. Die Versionen 1.x (ab 1.9) und 2.x besitzen eine kompatible API. Seit dem 9. Juni 2016 mit der Veröffentlichung der Version 3.0 wurde ein neuer Versionsstrang eingeführt. Dieser ist im Großteil ebenfalls rückwärtskompatibel. Der Versionsstrang 1.x begann im Juni 2006 als Version 1.0 als Alpha-Version.[12] Die erste Version des Versionsstrangs 2.x wurde im April 2013 unter der Bezeichnung „jQuery 2.0“ veröffentlicht. Aufgrund besserer JavaScript-Unterstützung moderner Webbrowser (zum Beispiel Zugriffe auf DOM-Knoten) konnte der Quellcode von jQuery 2.0 grundlegend umstrukturiert und aufgeräumt werden. Im Gegenzug wurde die Unterstützung für ältere Browser wie den Internet Explorer bis einschließlich Version 8 (und der Kompatibilitätsansicht in aktuelleren Versionen) entfernt. Weil diese älteren Browser je nach Einsatzgebiet teilweise noch relativ hohe Verwendungszahlen besitzen, wurde die 1.x-Versionslinie aus Kompatibilitätsgründen bis zum Erscheinen der Version 3.0 am 9. Juni 2016 gewartet und aktualisiert.[13][14] Die Versionslinie 1.x und 2.x werden weiterhin mit sicherheitsrelevanten Patches versorgt.[13]
Der Versionsstrang 3.x verzichtet jedoch gänzlich auf die Unterstützung von Internet-Explorer-spezifischen Eigenheiten. Unter anderem wurde mit Version 3.0 die API für FunktionenjQuery bietet JavaScript-Entwicklern folgende Funktionen:
BenutzungDie jQuery-Basisbibliothek besteht aus einer JavaScript-Datei, in der alle grundlegenden DOM-, Ereignis-, Effekt- und Ajax-Funktionen enthalten sind. Nachdem die Datei, welche die Bibliothek enthält, im HTML-Dokument eingebunden ist, kann jQuery benutzt werden. Typischerweise wird durch den Zugriff auf Objekte mit der Um mit mehreren Bibliotheken, die das $-Zeichen als Aufruf nutzen, arbeiten zu können, kann man dieses bei jQuery deaktivieren: // gibt das $-Zeichen für andere Bibliotheken frei (kann auch mit der $-Notation aufgerufen werden)
jQuery.noConflict();
Eine typische Manipulation von DOM-Elementen beginnt mit der $("div.test, p.quote")
.addClass("blue")
.slideUp("slow");
// oder auch
jQuery("div.test, p.quote")
.addClass("blue")
.slideUp("slow");
In diesem Beispiel werden alle Zusätzlich existieren globale Hilfsfunktionen. Diese können mit Hilfe der var meinArray = [1, 2, 3];
$.each(meinArray, function() {
document.write(this + 1);
});
Dieses Beispiel schreibt Ajax-Funktionalitäten können mit Hilfe von $.ajax({
type: "POST",
url: "beispiel.php",
data: "name=Mustermann&location=Berlin",
}).done(function(response){
alert("Daten gespeichert: " + response);
});
Mit Hilfe von jQuery können den DOM-Elementen auch Events hinzugefügt werden: $(function() {
$("div.test a").on('click', function() {
alert("Hello world!");
});
});
In diesem Beispiel wird nach dem Laden der DOM-Struktur jedem „a“-Element, das sich innerhalb von Siehe auchLiteratur
Weblinks
Einzelnachweise
|
||||||||||||||||||||||||
