1 einleitung auf dem weg zum web 2.0 (was immer das sein mag) ist jquery klein und fix hängt damit...
TRANSCRIPT
![Page 1: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/1.jpg)
Einleitung
• Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix
• Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab
• Kreuzt zwar die Wege der anderen, geht aber seinen eigenen
![Page 2: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/2.jpg)
Übersicht
• Klein – komprimiert etwa 15kb + plus plugins die i.d.r. ebenfalls extrem klein sind
• Elegant – kompakte Syntax• Schnell – wird ausgeführt, sobald das DOM geladen
ist (wartet nicht auf das komplette Dokument wie onload)
• Modular – leicht durch Plugins erweiterbar, oder auch Expressions etc.
• Kompatibel – unterstütz IE, FF, Opera, Safari• Objektorientiert – ohne krampfhaft alles auf Pseudo-
Klassen abzubilden
![Page 3: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/3.jpg)
Praxis Übersicht
• Selektion: Gib mir alle Elemente mit der Klasse "list" innerhalb des Elements mit der ID "content"
• Manipulation: Inhalt generieren, bearbeiten oder entfernen, Styles bearbeiten, Klassen hinzufügen oder entfernen
• AJAX: Einfaches get zum laden von Bildern (kein XMLHTTPRequest), vollständiger XMLHTTPRequest mit allem drum und dran elegant gekapselt
• Effekte: fadeIn/Out, slideUp/Down• Tolle Plugins, Tabs mit Beispielen bereit halten!
![Page 4: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/4.jpg)
Selektoren I
• $(document).ready(function() {…} führt die übergebene Funktion aus, sobald das DOM geladen ist, je nach Inhalt der Seite sogar deutlich früher als onload
• Klasse "required" markiert benötigtes Feld• Funktioniert mit input (type="text"), textarea und
select• Mit addClass und removeClass CSS-Klassen
ändern• DEMO BEREIT HALTEN
![Page 5: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/5.jpg)
Selektoren II
• Selektoren sind Kombinationen aus CSS, XPath und eine Prise Eigenkreation
• div – CSS• [@id='…'] – XPath• *= - Eigenkreation• DEMO BEREITHALTEN
![Page 6: 1 Einleitung Auf dem Weg zum Web 2.0 (was immer das sein mag) ist jQuery klein und fix Hängt damit die "Großen" wie Prototype, Dojo oder Mochikit ab Kreuzt](https://reader035.vdokument.com/reader035/viewer/2022071808/570491cd1a28ab14218df10e/html5/thumbnails/6.jpg)
AJAX & FX I
• Rate me: http://fuzz.bassistance.de/jqueryDev/example-rateme.html
• Code erzeugt Markup für die Links, setzt click-Handler ein, sendet request mit parameter und zeigt Ergebnis (Durchschnitt und Anzahl Ratings) an
• DEMO BEREITHALTEN (Internet wird benötigt!)