jQuery ist eine clientseitige Skriptbibliothek, die fast jede moderne Website verwendet - sie macht Websites interaktiv. Es ist nicht die einzige Javascript-Bibliothek, aber es ist am weitesten entwickelt, am meisten unterstützt und am weitesten verbreitet. Es ist einer der Bausteine jeder modernen Website. Aber was genau ist jQuery, was macht es so populär und warum sollte es dich interessieren, wenn du als Webentwickler anfängst?
Was ist jQuery?
jQuery ist eine Erweiterung von Javascript, einer Bibliothek von Javascript-Funktionen und Dienstprogrammen, die visuelles Flair verleihen und erweiterte Funktionen in wenigen Codezeilen einfach implementieren. Es wird browserübergreifend und Open Source unterstützt. Außerdem können Sie die jQuery-Funktionalität mit einfach zu verwendenden Plugins erweitern.
jQuery baut auf Javascript auf, fügt jedoch Methoden und Funktionen hinzu, die in reinem Javascript nicht zu finden sind. Es wurde erstellt, um die Verwendung von Javascript zu vereinfachen und die Probleme zu beseitigen, die bei verschiedenen Javascript-Implementierungen in verschiedenen Browsern auftreten. Mit jQuery können Sie nur einmal schreiben und jQuery wird Ihren Code für jeden Browser korrekt interpretieren.
Die Hauptfunktion von jQuery ist die DOM-Manipulation (DOM ist das Document Object Model), und es bedeutet die zugrunde liegende Struktur einer Webseite, die Sie besuchen. Alles, was Sie auf der Seite sehen - und viele, die Sie nicht sehen - sind im DOM vertreten.
jQuery ist nicht die einzige Javascript-Bibliothek da draußen, aber es ist die beliebteste - etwa 55% der Top-10.000-Websites verwenden es. Prototype, MooTools und Scriptaculous sind beliebte Alternativen, aber nicht annähernd so gut unterstützt.
Clientseite gegenüber Serverseite
Die meisten Webseiten werden auf der Serverseite erstellt - MakeUseOf verwendet PHP und MySQL (in Form von WordPress), um die Artikeldaten aus einer Datenbank abzurufen und dann eine Vorlage auf diese Daten anzuwenden. Die resultierende Seite wird an Ihren Browser gesendet, interpretiert und Ihnen angezeigt. Wenn Sie auf einen Link klicken, wird eine weitere Anfrage an die Datenbank gesendet und eine weitere Seite wird generiert. Aber was, wenn Sie eine Art von Interaktivität auf der Seite erstellen möchten? Ein Formular, das überprüft, was der Benutzer eingibt (wie Twitter, der zählt, wie viele Buchstaben Sie noch haben), eine Schaltfläche, die ein Dialogfeld öffnet, oder Sie möchten möglicherweise mehr Daten laden, ohne die gesamte Seite neu zu laden?
Hier kommt das clientseitige Scripting ins Spiel. Das ist der Punkt, an dem der Client - Ihr Browser - das Schwergewicht übernimmt. Die meisten Websites, einschließlich dieser, verwenden ein wenig von beidem.
Warum jQuery verwenden?
Visuelles Flair
jQuery können Sie Teile der Webseite als Reaktion auf Benutzeraktionen ändern. Als schnelles Beispiel klicken Sie auf diesen Link - jeder Link auf der Seite wird rot angezeigt . Nutzlos? Vielleicht, aber Sie verstehen es. Bild-Diashows werden häufig von jQuery verwendet. Das Abwägen von sinnlosen visuellen Effekten und wirklich nützlichen Ergänzungen zur Benutzererfahrung ist Teil der Fähigkeit, ein Webentwickler zu sein.
Hier ist eine kurze Liste von einigen wirklich tollen Effekten, die Sie erreichen können.
Einfache Ereignisse
Nahezu die gesamte Software arbeitet an einem Ereignismodell - klicken Sie auf etwas und ein Klickereignis wird ausgelöst. Ziehen Sie Ihren Finger über ein Tablett und ein Ziehereignis wird ausgelöst. Anwendungen "hören" auf diese Ereignisse und machen etwas - jQuery ermöglicht dies in einem Browser.
Führe AJAX einfach durch
Asynchrones JavaScript und XML ist eine Möglichkeit, mit einem Remote-Server zu kommunizieren, ohne eine andere Seite laden zu müssen. Ein gutes Beispiel dafür ist der Facebook-Status-Stream. Versuchen Sie, durch alle Ihre Aktualisierungen zu blättern, bis Sie ganz nach unten kommen. Du kannst nicht. Sobald Sie das Ende erreicht haben, erkennt jQuery, dass Sie in der Nähe sind, und sendet eine AJAX-Anfrage, damit mehr Status angezeigt werden.
Es injiziert sie dann in die aktuelle Seite, ohne dass Sie es merken. Sie erhalten einen unbegrenzten Strom von Updates, aber sie werden nicht alle zu Beginn geladen.
Fortgeschrittene Benutzeroberflächen
Zusammen mit dem jQuery UI-Core-Plug-in können Sie komplette Webanwendungen mit Standardformularkomponenten erstellen. Fortschrittsbalken, Schieberegler, Schaltflächen, Tabs, Drag & Drop - es ist alles da. Mit einem einfachen Themes-System können Sie das Erscheinungsbild anpassen oder eine der Standardeinstellungen verwenden.
Kümmert mich das?
Wenn Sie überhaupt Interesse an der Entwicklung von Websites haben, welche Programmiersprache zu lernen - Web-Programmierung Welche Programmiersprache zu lernen - Web-Programmierung Heute werfen wir einen Blick auf die verschiedenen Web-Programmiersprachen, die das Internet antreiben. Dies ist der vierte Teil einer Anfänger-Programmierserie. In Teil 1 lernten wir die Grundlagen von ... Read More, dann ja - jQuery ist eine Sache, die Sie unbedingt lernen müssen. Wenn du dich jemals gefragt hast "Wie kann ich X machen, wenn der Benutzer Z macht?", Dann wirst du jQuery lieben. Hinzufügen zu Ihrer Website ist so einfach wie das Hinzufügen eines Links zu ihm in der Kopfzeile; oder WordPress sagen, es zu laden.
Möchtest du jQuery lernen? Lassen Sie es uns in den Kommentaren wissen und ich werde sehen, was ich tun kann.
Bild-Credits: Dynamisch rotierende Billboard erstellt mit jQuery, PistolSlut.com, Chart mit jQuery gemacht