15 Ressourcen für den Einstieg in jQuery

Vielleicht bist du ein erfahrener jQuery-Profi. Heck, vielleicht bist du John Resig. Andererseits lesen Sie vielleicht Wörter wie "Prototype", "jQuery" und "Mootools" und überlegen sich: "Was zum Teufel sind das?" Jetzt ist es an der Zeit zu lernen.

In dieser Branche werden Designer mehr denn je zu Programmierern und Programmierer zu Designern. Die Idee, dass ein Entwickler NUR Frontend- oder Backend-Arbeiten durchführt, entwickelt sich schnell zu einem veralteten Konzept. jQuery wird helfen, die Lücke zu schließen. Javascript ist keine unerreichbare Fähigkeit. In diesem Artikel werden fünfzehn Ressourcen beschrieben, damit Sie mit jQuery vom absoluten Anfang an anfangen können. Wenn Sie diese Bibliothek aus irgendeinem dummen Gefühl der Angst gemieden haben, ist jetzt die Zeit zum Eintauchen. Sie werden staunen, wie einfach es sein kann.

Was genau ist jQuery?

Laut jQuery.com ist jQuery eine schnelle, prägnante JavaScript-Bibliothek, die das Durchlaufen von HTML-Dokumenten, das Verwalten von Ereignissen, das Durchführen von Animationen und das Hinzufügen von Ajax-Interaktionen zu Ihren Webseiten vereinfacht. jQuery soll die Art und Weise ändern, in der Sie JavaScript schreiben.

Einfacher ausgedrückt: Mit jQuery können Sie zehn Zeilen traditionellen Javascript-Codes in zwei Zeilen verwandeln! Kombinieren Sie eine enorme Palette an Funktionen mit plattformübergreifender Kompatibilität und Sie haben ein robustes Framework. Bevor Sie es wissen, erstellen Sie alles von reichen Formularen bis zu Flash-ähnlichen Menüs. Machen Sie sich keine Sorgen, wenn das Lernen eines weiteren neuen Rahmens entmutigend erscheint. Diese Ressourcen führen Sie Schritt für Schritt.

Warum sollte ich diese Bibliothek über die anderen verwenden??

Letztendlich kommt es auf die Präferenz an. Jedes Framework hat seine spezifischen Vorteile. Es gibt jedoch einen Grund, warum jQuery das beliebteste verfügbare Framework ist.

Browserübergreifende Kompatibilität. Bei jeder Javascript-Implementierung kann ein Webentwickler erwarten, dass er einen großen Teil seiner Zeit damit verbringt, die Eigenheiten jedes Browsers zu kompensieren. Glücklicherweise neutralisiert die jQuery-Bibliothek diese Browser-Inkonsistenzen, sodass Entwickler mehr Zeit für die Bearbeitung ihres Codes haben.

CSS-Selektoren. Mithilfe der CSS-Syntax können Entwickler ihr vorhandenes Wissen zum Durchsuchen ihrer Dokumente verwenden. Mit vielen CSS 3- und XPATH-Selektoren bietet jQuery einen wunderbaren Mechanismus zum Manipulieren der Elemente auf Ihrer Seite.

Verkettung. jQuery verwendet für seine Methoden ein Muster namens "Chaining". Bei jeder Ausführung einer Methode für ein jQuery-Objekt gibt die Methode dasselbe jQuery-Objekt zurück. Folglich müssen Sie Ihre Selektoren nicht für jede Methode erneut eingeben. Die Verwendung einer solchen ".NET" -Funktionalität ermöglicht geringere Dateigrößen und eine bessere Lesbarkeit des Codes.

Wenn Sie fasziniert sind, sollten Sie es sein! Lass uns anfangen.

Schritt 1: Laden Sie die Bibliothek herunter

Der erste Schritt auf Ihrer Reise ist das Herunterladen der Bibliothek. Besuchen Sie jQuery.com und blättern Sie zum Abschnitt "Download jQuery". Wenn Sie einen der aufgelisteten Links auswählen, wird die Bibliothek auf Ihren Computer heruntergeladen. Als Nächstes müssen Sie die JS-Datei in Ihre Projektmappe importieren.

Literatur-Empfehlungen
  • CSS-Tricks.com: Einführung in jQuery

    In seinem jQuery-Screencast wird Chris Coyier über CSS-Tricks eine grundlegende Einführung geben, wie Sie jQuery in Ihre Webseite einfügen und ein paar Funktionen schreiben können.

    Artikel besuchen

  • Digital-Web.com: jQuery: Ein Crash-Kurs

    Hier ist ein Absturzkurs in jQuery, der für Codebegeisterte Webdesigner geschrieben wurde.

    Artikel besuchen

  • Slideshare.net: "JQuery lernen in 30 Minuten"

    Wenn Sie Diashows mögen, werden Sie in diesem Tutorial in dreißig Minuten die Grundlagen von jQuery kennen lernen.

    Artikel besuchen

Schritt 2: Erstellen Sie Ihre erste Funktion

Innerhalb von fünf Minuten nach dem Erlernen von jQuery erstellen Sie Funktionen. Ihr erster Halt sollte der einleitende Artikel von John Resig sein, "Wie jQuery funktioniert". Er zeigt Ihnen viele leicht verständliche Methoden, die Sie in Ihren Webanwendungen verwenden können, darunter das Hinzufügen und Entfernen von Klassen, das Verketten und das Aufrufen der Methode "document.ready".

Literatur-Empfehlungen

  • jQuery.com: "Wie jQuery funktioniert"

    In seinem einleitenden Artikel wird John Resig - der Schöpfer von jQuery - Sie von den Grundlagen zum Erstellen von Animationen führen. Dies ist eine wichtige Lektüre, wenn Sie gerade erst anfangen.

    Artikel besuchen

  • FünfzehnTageOfJquery.com: Tag 1

    In einem mutigen Versuch, viele Funktionen von jQuery in zwei Wochen abzudecken, behandelt "15 Days Of jQuery" ein Thema pro Tag. In diesem Artikel erfahren Sie, wie Sie die Methode "document.ready ()" verwenden.

    Artikel besuchen

  • VisualJquery.com: "Ihr jQuery-Wörterbuch"

    Stellen Sie sich VisualjQuery.com als Ihr digitales Wörterbuch vor. Es zeigt Ihnen die Syntax und Definition für jede verfügbare jQuery-Methode. Diese Site mit Lesezeichen versehen.

    Artikel besuchen

Schritt 3: Animieren Sie Ihre Elemente

Dies ist ein umstrittenes Thema für viele Entwickler. In der ersten Gruppe gibt es Leute, die auf "Zero-Animation" bestehen. Geben Sie den Benutzern so schnell wie möglich das, was sie brauchen, und lassen Sie sie unterwegs sein. Behandle sie nicht so, als wären sie Chipmunks, die nach dem nächsten glänzenden Spielzeug suchen. Aber es gibt auch Leute in der zweiten Gruppe. Sie betrachten eine Site, die einige geschmackvoll implementierte Animationen enthält, als eine Site, die ihrer Benutzerbasis würdig ist. Bei korrekter Anwendung glauben sie, dass Animationen die Benutzerfreundlichkeit erheblich verbessern können. Sie müssen selbst entscheiden, wer Sie sind. Trotzdem macht jQuery das Animieren von Elementen auf Ihrer Seite so einfach wie möglich.

Literatur-Empfehlungen

  • jQuery.com: "Animationen"

    Dies sollte der erste Schritt sein, wenn Sie die Animationsfähigkeiten von jQuery kennenlernen. Es werden die für diese Methode erforderlichen Parameter detailliert beschrieben.

    Artikel besuchen

  • Einzelne Designs: Lernen Sie die Animationsfähigkeiten von jQuery kennen

    Bist du ein absoluter Neuling in Sachen Animation? Dieses Tutorial setzt voraus, dass Sie keine Kenntnisse haben. Die behandelten Themen sind zunehmender und abnehmender Text, bewegliche Elemente, Verkettung von Animationen und mehr.

    Artikel besuchen

  • Web Designer Wall: jQuery-Tutorials für Designer

    Immer noch verwirrt über die Macht von jQuery? Auf dieser Website werden zehn Beispiele aufgeführt, die von Menüs bis zum Ersetzen von Bildern reichen.

    Artikel besuchen

Schritt 4: Plugins

Das Wunderbare an jQuery ist, dass John Resig und sein Team bei seiner ersten Entwicklung dafür gesorgt haben, dass die Erweiterung der Funktionalität durch Plugins mit nur wenigen zusätzlichen Codezeilen erreicht werden kann. In kürzester Zeit schreiben Sie eigene Methoden! Wenn Sie diese Plugins von der Hauptbibliothek getrennt halten (übrigens nur 16 KB), können wir bestimmte Plugins nur dann implementieren, wenn dies erforderlich ist. Dadurch kann die Größe Ihrer Javascript-Dateien so klein wie möglich bleiben.

Literatur-Empfehlungen

  • jQuery Corner Gallery

    Suchen Sie nach einer Möglichkeit, abgerundete Ecken zu Ihren Elementen hinzuzufügen? Bei Ecken, die von abgerundeten bis hin zu Hundeohren reichen, kann dieses Plugin eine dauerhafte Stelle in Ihrer "Toolbox" finden..

    Artikel besuchen

  • Verbessern Sie die Benutzererfahrung: 10 nützliche jQuery-Plugins

    In diesem Artikel beschreibt James Padolsey seine zehn beliebtesten Plugins.

    Artikel besuchen

  • jQuery.com: "Plugins"

    Wie immer erweist sich jQuery.com als wertvolle Ressource. Dieser Artikel enthält schrittweise Anweisungen zum Erstellen Ihres ersten Plugins.

    Artikel besuchen

Schritt 5: AJAX-Funktionalität implementieren

Fühlen Sie sich schon jetzt mit Ihren jQuery-Fähigkeiten sicher? Sind Sie bereit, die Dinge auf die nächste Stufe zu bringen? Warum beginnen Sie nicht, einige Ajax-Funktionen in Ihre Skripts zu implementieren? Durch die Verwendung der Methoden "load ()" und ".get ()" macht jQuery das Laden von Daten sehr einfach. Die folgenden Ressourcen werden für Ihre Ausbildung wesentlich sein.

Literatur-Empfehlungen

  • Sitepoint.com: Einfacher AJAX mit jQuery

    In seinem Artikel für Sitepoint wird Akash Mehta Ihnen zeigen, wie Sie das Hinzufügen von Ajax zu Ihren Anwendungen mit Hilfe von jQuery vereinfachen.

    Artikel besuchen

  • jQuery For Designers: Verwenden von AJAX zum Überprüfen von Formularen

    Remy zeigt uns, wie wir AJAX zusammen mit der jQuery-Bibliothek verwenden können, um unseren Formularen serverseitige Validierung hinzuzufügen.

    Artikel besuchen

  • Nettuts.com: Inhalte laden und animieren mit jQuery

    Denken Sie immer daran, die "Javascript" -Kategorie von NETTUT zu durchsuchen, wenn Sie nach jQuery-Tutorials suchen. In diesem Tutorial zeigen wir es Ihnen
    wie Sie Daten mit jQuery laden und animieren können.

    Artikel besuchen