und dann kam die Web2.0 Revolte, in der AJAX zum Thema wurde...
Heutzutage muss man sich Gott sei dank nicht mehr mit reiner Javascript Programmierung abgeben. Seit Mitte des letzten Jahrzehnts gibt es mit Prototype und JQuery zwei hervorragende Javascript Frameworks, die einem viel Arbeit abnehmen.
An dieser Stelle möchte ich mal eine Lanze für JQuery brechen, dass (gefühlt) deutlich mächtiger ist als Prototype. Naja, vielleicht ist es auch nur eine persönliche Antipatie gegen das Prototype-Framework, JQuery sagt mir persönlich jedenfalls deutlich mehr zu.
Worum geht's konkret?
JQuery kapselt den ganzen DOM-Baum und bietet weitreichende Möglichkeiten zur Manipulation des selbigen (setzen, löschen und verändern von Attributen und Styles; Hinzufügen und Löschen von Knoten im DOM-Baum...). Hinzu kommt eine mächtige Selektionssprache und eine schier unendliche Masse an verfügbaren Plugins. Zudem lässt sich JQuery ganz einfach selber um eigene Funktionalität erweitern.
Grundlage aller Operationen in JQuery ist der $-Operator als Kurzform für das JQuery Interface. Über $("#ichbineinid"), $(".icheineclass") und $("div") für Tags als grundlegende Selektoren lassen sich beliebige (Teil-)Mengen des DOM-Baums effizient auswählen und bearbeiten.
Da sich bekanntlich an einem Beispiel am besten lernen lässt: Ein kleines Snippet zur Manipulation von Attributen...
Source: 2-jquery1.html
So kurz das obige Beispiel auch sein mag, hier tut sich eine Menge:
Im Body werden zwei div Tags erzeugt, die jeweils durch ein class-Attribut gekennzeichnet sind.
Die eigentliche Magie steckt im Header: Zunächst wird das JQuery-Framework geladen. Danach wird jedem Button (jeder jeweils durch ein class Attribut bestimmt) eine eigene OnClick-Routine zugewiesen.
In Zeile 11 und 17 wird die default-Action des Events verhindert. Bei einem div-Tag passiert also nicht viel. Bei einem a-Tag hingegen würde das Verfolgen des Links verhindert.
event.target enthält das DOM-Element, für das das Event ausgelöst wurde. Mittels des $() Operators kann man sich das zugehörige JQuery Objekt holen und dann weitere Operationen durchführen.
Zugegeben, im obigen Beispiel passiert nichts wildes - der notwendige Quelltext ist dafür aber auch sehr elegant und kurz und kann daher gut als Basis für eigene Ausflüge in die JQuery Welt dienen. Und diese Welt hat noch einiges zu bieten. Angefangen bei einem recht mächtigen Animationsframework, weiter mit AJAX und und und...
Für weitere Ausflüge in die JQuery Welt hier noch ein paar nützliche Links.
Die offizielle JQuery-Doku - hierzu gibt es wohl nichts weiter zu schreiben
improve your jquery - 25 excellent-tips - der Seitentitel ist Programm...
Absolut empfehlenswert.
