Description
(Text)
Schnell und einfach interaktive Webseiten programmieren: Andy Harris zeigt Ihnen alles, was Sie über JavaScript wissen müssen, um dieses Ziel zu erreichen. Zunächst erlernen Sie die Grundlagen der Programmierung und erfahren dann, wie Sie Ihre HTML-Elemente mit JavaScript verändern und animieren. Auch die Themen Ajax und jQuery werden ausführlich behandelt.
HTML- und CSS-Kenntnisse sind für die Lektüre von Nutzen, Programmierkenntnisse benötigen Sie jedoch nicht. Mit den vielen verständlichen Beispielen finden sich auch Anfänger schnell zurecht, so dass Sie schon bald attraktive Webseiten entwickeln werden!
(Table of content)
Über den Autor 7
Kapitel Einführung 21
Was Sie benötigen 22
Wie dieses Buch aufgebaut ist 22
Teil I: Mit JavaScript programmieren 23
Teil II: Seiten mit JavaScript aufwerten 23
Teil III: Zu AJAX aufsteigen 23
Teil IV: Der Top-Ten-Teil 23
Und dann gibt's noch was im Internet! 24
Symbole, die in diesem Buch verwendet werden 24
Wie es weitergeht 25
Zum Abschluss 25
Eine Anmerkung der Übersetzerin 25
Teil I
Mit JavaScript programmieren 27
Kapitel 1
Das Web auf die nächste Ebene bringen 29
Etwas wirklich Cooles zusammenbauen 29
Erste Schritte 34
Ein Überblick über die zentralen Technologien 34
Den Computer wählen 35
Einen Editor auswählen 36
Vermeiden Sie problematische Werkzeuge 36
Einen WYSIWYG-Editor verwenden 37
Die Editoren der Programmierer 38
Sich mit einigen bekannten Editoren vertraut machen 39
Aptana 41
Eine Browser-Sammlung aufbauen 43
Einen Standard einrichten 43
Sich für einen oder zwei Browser entscheiden 44
Aus Firefox eine Entwicklungsmaschine machen 45
Die Symbolleiste "Web-Developer" 46
Der HTML Validator 46
Firebug 47
Kapitel 2
Schreiben Sie Ihr erstes Programm 49
Ein Programmierer werden 49
Einen JavaScript-Editor auswählen 50
Einen Browser zum Testen wählen 51
Einer Seite ein Skript hinzufügen 51
Den JavaScript-Code einbetten 53
Kommentare schreiben 54
Die Methode "alert()" für die Ausgabe verwenden 54
Das Semikolon hinzufügen 54
Variablen 54
Eine Variable für die Datenablage erstellen 56
Den Benutzer nach Informationen fragen 56
Dem Benutzer antworten 57
Mit einer Verknüpfung eine freundlichere Begrüßung erreichen 57
Literale und Variablen im Vergleich 59
Leerzeichen in verknüpften Phrasen verwenden 59
Das String-Objekt 60
Eine Einführung in objektorientierte Programmierung (und Kühe) 60
Die Länge eines Strings herausfinden 61
Text mit String-Methoden ändern 62
Variablentypen 65
Zahlen addieren 65
Zahlen aus Benutzereingaben addieren 66
Das Problem mit dynamischen Daten 68
Das verflixte Pluszeichen 69
Den Variablentyp ändern 69
Werkzeuge zur Umwandlung von Variablen verwenden 70
Eingaben korrigieren 71
Kapitel 3
Das Verhalten eines Programms über Bedingungen ändern 73
Mit Zufallszahlen arbeiten 73
Einen Würfel herstellen 74
Der Würfel ist gefallen 74
Den Ablauf mit "if" steuern 76"If" und sonst nichts 78
Bedingungen verwenden 78
Vergleichsoperatoren 79
Machen Sie, was ich sage, ansonsten . . . 80"else if" für komplexere Interaktionen verwenden 82
Das Geheimnis des überflüssigen "else" 83
Es ist Zeit für eine neue Denkweise 84
Einen Ausdruck erstellen 85"Switchen" mit Stil 87
Verschachtelte "if"-Anweisungen 87
Verschachtelte Bedingungen erstellen 88
Verschachtelte "if"-Anweisungen sinnvoll einsetzen 89
Kapitel 4
Schleifen und Fehlersuche 91
Eine zählende Schleife mit "for" herstellen 91
Eine Standardschleife mit "for" anlegen 92
Eine rückwärts laufende Schleife erstellen 93
Gleich um fünf weitergehen 94
Eine Zeit lang Schleifen drehen 96
Eine grundlegende "while"-Schleife erstellen 96
Vermeiden Sie Schleifenfehler 98
Eine Einführung in bösartige Schleifen 98
Mit einer zögerlichen Schleife umgehen 99
Mit einer zwanghaften Schleife umgehen 99
Den Code debuggen 100
Hilfe durch Aptana 100
JavaScript in IE debuggen 101
Fehler mit Firefox finden 103
Syntaxfehler mit Firebug einfangen 103
Logische Fehler einfangen 104
Mit Firebug in die Konsole protokollieren 105
Die Konsolenausgabe beobachten 106
Einen interaktiven Debugger verwenden 107
Einen Haltepunkt setzen 109
Den Debugger ablaufen lassen 109
Die Perspektive "Debug" verwenden 110
Ein angehaltenes Programm im Debug-Modus untersuchen 111
Das Programm durchlaufen 113
Die Daten von Ausdrücken betrachten 113
Den Debugge
Contents
Uber den Autor 7 Kapitel Einfuhrung 21 Was Sie benotigen 22 Wie dieses Buch aufgebaut ist 22 Teil I: Mit JavaScript programmieren 23 Teil II: Seiten mit JavaScript aufwerten 23 Teil III: Zu AJAX aufsteigen 23 Teil IV: Der Top-Ten-Teil 23 Und dann gibt's noch was im Internet! 24 Symbole, die in diesem Buch verwendet werden 24 Wie es weitergeht 25 Zum Abschluss 25 Eine Anmerkung der Ubersetzerin 25 Teil I Mit JavaScript programmieren 27 Kapitel 1 Das Web auf die nachste Ebene bringen 29 Etwas wirklich Cooles zusammenbauen 29 Erste Schritte 34 Ein Uberblick uber die zentralen Technologien 34 Den Computer wahlen 35 Einen Editor auswahlen 36 Vermeiden Sie problematische Werkzeuge 36 Einen WYSIWYG-Editor verwenden 37 Die Editoren der Programmierer 38 Sich mit einigen bekannten Editoren vertraut machen 39 Aptana 41 Eine Browser-Sammlung aufbauen 43 Einen Standard einrichten 43 Sich fur einen oder zwei Browser entscheiden 44 Aus Firefox eine Entwicklungsmaschine machen 45 Die Symbolleiste »Web-Developer« 46 Der HTML Validator 46 Firebug 47 Kapitel 2 Schreiben Sie Ihr erstes Programm 49 Ein Programmierer werden 49 Einen JavaScript-Editor auswahlen 50 Einen Browser zum Testen wahlen 51 Einer Seite ein Skript hinzufugen 51 Den JavaScript-Code einbetten 53 Kommentare schreiben 54 Die Methode »alert()« fur die Ausgabe verwenden 54 Das Semikolon hinzufugen 54 Variablen 54 Eine Variable fur die Datenablage erstellen 56 Den Benutzer nach Informationen fragen 56 Dem Benutzer antworten 57 Mit einer Verknupfung eine freundlichere Begrussung erreichen 57 Literale und Variablen im Vergleich 59 Leerzeichen in verknupften Phrasen verwenden 59 Das String-Objekt 60 Eine Einfuhrung in objektorientierte Programmierung (und Kuhe) 60 Die Lange eines Strings herausfinden 61 Text mit String-Methoden andern 62 Variablentypen 65 Zahlen addieren 65 Zahlen aus Benutzereingaben addieren 66 Das Problem mit dynamischen Daten 68 Das verflixte Pluszeichen 69 Den Variablentyp andern 69 Werkzeuge zur Umwandlung von Variablen verwenden 70 Eingaben korrigieren 71 Kapitel 3 Das Verhalten eines Programms uber Bedingungen andern 73 Mit Zufallszahlen arbeiten 73 Einen Wurfel herstellen 74 Der Wurfel ist gefallen 74 Den Ablauf mit »if« steuern 76 »If« und sonst nichts 78 Bedingungen verwenden 78 Vergleichsoperatoren 79 Machen Sie, was ich sage, ansonsten ... 80 »else if« fur komplexere Interaktionen verwenden 82 Das Geheimnis des uberflussigen »else« 83 Es ist Zeit fur eine neue Denkweise 84 Einen Ausdruck erstellen 85 »Switchen« mit Stil 87 Verschachtelte »if«-Anweisungen 87 Verschachtelte Bedingungen erstellen 88 Verschachtelte »if«-Anweisungen sinnvoll einsetzen 89 Kapitel 4 Schleifen und Fehlersuche 91 Eine zahlende Schleife mit »for« herstellen 91 Eine Standardschleife mit »for« anlegen 92 Eine ruckwarts laufende Schleife erstellen 93 Gleich um funf weitergehen 94 Eine Zeit lang Schleifen drehen 96 Eine grundlegende »while«-Schleife erstellen 96 Vermeiden Sie Schleifenfehler 98 Eine Einfuhrung in bosartige Schleifen 98 Mit einer zogerlichen Schleife umgehen 99 Mit einer zwanghaften Schleife umgehen 99 Den Code debuggen 100 Hilfe durch Aptana 100 JavaScript in IE debuggen 101 Fehler mit Firefox finden 103 Syntaxfehler mit Firebug einfangen 103 Logische Fehler einfangen 104 Mit Firebug in die Konsole protokollieren 105 Die Konsolenausgabe beobachten 106 Einen interaktiven Debugger verwenden 107 Einen Haltepunkt setzen 109 Den Debugger ablaufen lassen 109 Die Perspektive »Debug« verwenden 110 Ein angehaltenes Programm im Debug-Modus untersuchen 111 Das Programm durchlaufen 113 Die Daten von Ausdrucken betrachten 113 Den Debugger Firebug verwenden 115 Kapitel 5 Funktionen, Arrays und Objekte 117 Aus Code Funktionen machen 117 Ameisen zum Picknick einladen 117 Uber die Struktur des Liedes (und des Programms) nachdenken 118 Das Programm »antsFunktion.html« anlegen 119 Daten an Funktionen ubergeben und von ihnen erhalten 120 Das Hauptprogramm untersuchen 122 Der Refrain 122 Vom Umgang mit den Strophen 123 Gultigkeitsbereiche 125 Eine Einfuhrung in lokale und globale Variablen 125 Den Gultigkeitsbereich von Variablen untersuchen 125 Ein Basisarray anlegen 128 Eine Datenliste in einem Array ablegen 129 Auf Daten im Array zugreifen 129 Arrays mit einer »for«-Schleife verwenden 130 Besuchen Sie noch einmal die Ameisen 132 Mit zweidimensionalen Arrays arbeiten 133 Die Arrays einrichten 135 Eine Stadt erhalten 136 Die zentrale Funktion »zentral()« anlegen 137 Eigene Objekte erstellen 138 Ein Basisobjekt anlegen 138 Einem Objekt Methoden hinzufugen 140 Ein wiederverwendbares Objekt anlegen 141 Das schone, neue Objekt verwenden 143 Eine Einfuhrung in JSON 144 Daten im JSON-Format ablegen 144 Komplexere JSON-Strukturen anlegen 146 Teil II Seiten mit JavaScript aufwerten 149 Kapitel 6 Mit der Seite reden 151 Das Document Object Model verstehen 151 Sich im DOM zurechtfinden 151 DOM-Eigenschaften mit Firebug andern 153 Das Objekt »document« untersuchen 153 Das DOM uber JavaScript nutzen 155 Sich den Blues holen -- im JavaScript-Stil 155 JavaScript-Code schreiben, um Farben zu andern 156 Schaltflachenereignisse verwalten 157 Das Spielfeld einrichten 158 Anfuhrungszeichen in Anfuhrungszeichen unterbringen 160 Die Funktion »farbeAendern« schreiben 160 Texteingabe und Textausgabe verarbeiten 161 Eine Einfuhrung in die ereignisgesteuerte Programmierung 162 Das XHTML-Formular erstellen 162 »getElementById()« fur den Zugriff auf die Seite verwenden 164 Das Textfeld verarbeiten 164 In das Dokument schreiben 165 Das HTML-Framework vorbereiten 166 Den JavaScript-Anteil schreiben 167 Das interne HTML finden 167 Mit weiteren Textelementen arbeiten 168 Das Formular anlegen 169 Die Funktion schreiben 171 Den Quellcode verstehen 172 Kapitel 7 Fur gultige Eingaben sorgen 175 Eingabe uber eine Drop-down-Liste erhalten 175 Das Formular anlegen 176 Das Listenfeld auslesen 177 Die Mehrfachauswahl 178 Ein »select«-Objekt fur eine Mehrfachauswahl codieren 178 Den JavaScript-Code schreiben 180 Kontrollkastchen auslesen 183 Die Seite mit den Kontrollkastchen anlegen 184 Auf die Kontrollkastchen antworten 185 Mit Optionsfeldern arbeiten 186 Optionsfelder auswerten 188 Mit regularen Ausdrucken arbeiten 189 Regulare Ausdrucke vorstellen 193 Zeichen in regularen Ausdrucken 195 Den Anfang und das Ende einer Zeile markieren 196 Mit besonderen Zeichen arbeiten 197 Ein Zeichen mit einem Punkt abgleichen 197 Eine Zeichenklasse verwenden 197 Nur Ziffern 197 Satzzeichen markieren 197 Worter suchen 198 Wiederholte Operationen 198 Eines oder mehrere Elemente finden 198 Null oder mehr Ubereinstimmungen 198 Die Anzahl an Zeichen festlegen 198 Mit dem Musterspeicher arbeiten 199 Die Erinnerungen zuruckholen 199 Muster verwenden, die im Arbeitsspeicher liegen 199 Kapitel 8 Verschieben und bewegen 201 Bewegung hineinbringen 201 Einen Blick auf den HTML-Code werfen 202 Ein Uberblick uber den JavaScript-Teil 205 Globale Variablen anlegen 205 Initialisierung 206 Das Sprite bewegen 207 Die Begrenzungen uberprufen 209 Tastatureingaben auslesen 211 Die Seite fur die Tastatur anlegen 211 Einen Blick auf »tastatur.js« werfen 213 Die Funktion »init()« uberschreiben 213 Eine Ereignisbehandlung einrichten 214 Auf das Drucken von Tasten reagieren 215 Das Geheimnis der Tastencodes enthullen 217 Der Maus folgen 218 Einen Blick auf den HTML-Code werfen 218 HTML einrichten 219 Den Code initialisieren 220 Den »Lauscher« fur die Maus anlegen 220 Automatische Bewegung 221 Animation mit Bilduberlagerung: Trickfilme 224 Die Bilder vorbereiten 225 Die Seite anlegen 225 Die globalen Variablen anlegen 227 Das Interval einrichten 228 Die Animation durch Vorladen verbessern 228 Mit zusammengesetzten Bildern arbeiten 231 Das Bild vorbereiten 231 HTML und CSS einrichten 232 Das JavaScript schreiben 233 Globale Variablen einrichten 234 Eine »init()«-Funktion anlegen 234 Das Sprite animieren 235 Verschieben und uberlagern 235 Das HTML-Framework anlegen 236 Den Code anlegen 237 Globale Variablen definieren 238 Die Daten initialisieren 239 Das Bild animieren 239 Das Bild aktualisieren 239 Das Sprite verschieben 240 Teil III Zu AJAX aufsteigen 241 Kapitel 9 Die Grundlagen von AJAX 243 AJAX: Die Ruckkehr nach Troja 243 AJAX ausgeschrieben 245 A steht fur asynchron 245 J steht fur JavaScript 245 A steht fur das englische ... and? 246 Und X steht fur ... ? 246 Grundlegende AJAX-Verbindungen herstellen 246 Das HTML-Formular anlegen 249 Ein »XMLHttpRequest«-Objekt erstellen 250 Eine Verbindung zum Server offnen 251 Anfrage und Parameter senden 252 Den Status uberprufen 252 Und nun alle zusammen: Wir wollen die asynchrone Verbindung sehn! 254 Das Programm einrichten 256 Die Funktion »getAJAX« anlegen 256 Die Antwort auslesen 257 Kapitel 10 JavaScript und AJAX durch jQuery verbessern 259 Eine Einfuhrung in JavaScript-Bibliotheken 259 jQuery kennenlernen 261 jQuery installieren 262 jQuery von Google importieren 262 jQuery mit Aptana verwenden 263 Die erste jQuery-Anwendung schreiben 267 Die Seite einrichten 267 Das jQuery-Knotenobjekt 269 Eine Initialisierungsfunktion anlegen 270 »$(document).ready()« verwenden 270 Alternativen zu »document.ready« entdecken 272 Das jQuery-Objekt erkunden 273 Den Stil eines Elements andern 273 jQuery-Objekte auswahlen 275 Die Stile modifizieren 275 Objekte um Ereignisse erweitern 276 Ein »hover«-Ereignis hinzufugen 276 Klassen auf die Schnelle andern 279 AJAX-Anfragen mit jQuery erledigen 281 Eine Textdatei mit AJAX einbinden 281 CMS fur Arme mit AJAX 283 Kapitel 11 jQuery animieren 287 Animationen vorbereiten 287 Den Grundstein mit HTML und CSS legen 292 Die Seite mit Startwerten versehen 292 Mit Ruckruffunktionen arbeiten 293 Den Inhalt anzeigen und verbergen 294 Die Sichtbarkeit ein- und ausschalten 294 Ein Element gleiten lassen 294 Ein Element ein- und ausblenden 295 Die Position eines Elements mit jQuery andern 296 Das HTML-Framework anlegen 299 Die Ereignisse einrichten 299 Verkettungen 300 Die Funktion »move()« durch Verkettung anlegen 301 Mit »animate()« eine zeitabhangige Animation anlegen 301 Nur ein Stuckchen verschieben: Relative Bewegung 302 Elemente auf die Schnelle andern 303 Die Seitengrundlage erstellen 309 Den Code mit Startwerten versehen 310 Text hinzufugen 310 Kopieren geht uber Studieren 311 Das ist eine Hulle 312 Stile abwechseln lassen 313 Die Seite zurucksetzen 313 Noch mehr Selektoren und Filter 314 Kapitel 12 Das jQuery User Interface Toolkit 315 Einen Blick auf den ThemeRoller werfen 316 Den Themenpark besuchen 318 Elemente ziehen und ablegen 319 Die Bibliothek herunterladen 322 Die Grosse eines Themas andern 323 Das HTML und das Standard-CSS untersuchen 326 Dateien importieren 327 Ein in seiner Grosse anderbares Element herstellen 327 Elementen Themen hinzufugen 328 Ein Symbol hinzufugen 330 Ziehen, ablegen und zuruckrufen 331 Die Seitengrundlage anlegen 334 Die Seite mit Startwerten versehen 335 Das Ablegen 336 Ablegen kann Spass machen 337 Elemente klonen 337 Kapitel 13 Die Benutzerfreundlichkeit mit jQuery verbessern 341 Designs mit vielen Elementen 341 Das Widget Accordion 342 Eine Oberflache mit Registerkarte anlegen 346 Registerkarten und AJAX 350 Die Benutzerfreundlichkeit verbessern 351 Das Datum 353 Zahlen mit einem Schieberegler auswahlen 355 Auswahlbare Elemente 357 Eine sortierbare Liste anlegen 358 Ein benutzerdefiniertes Dialogfeld anlegen 360 Kapitel 14 Mit AJAX-Daten arbeiten 363 Ein Uberblick uber serverseitige Programmierung 363 Eine Einfuhrung in PHP 364 Ein Formular fur eine PHP-Verarbeitung schreiben 365 Auf die Anfrage antworten 367 Anfragen im AJAX-Stil senden 369 Die Daten senden 369 Auf die Ergebnisse antworten 371 Ein interaktiveres Formular anlegen 372 Ein AJAX-Formular erstellen 373 Den JavaScript-Code schreiben 375 Das Ergebnis verarbeiten 376 PHP fur AJAX vereinfachen 376 Mit XML-Daten arbeiten 376 Eine Bewertung von XML 377 XML mit jQuery abandern 379 HTML anlegen 381 Die Daten erhalten 381 Die Ergebnisse verarbeiten 381 Den Namen des Haustiers ausgeben 382 Mit JSON-Daten arbeiten 383 JSON verstehen 383 JSON-Daten mit jQuery auslesen 385 Das Framework bewaltigen 387 Die JSON-Daten empfangen 387 Die Ergebnisse verarbeiten 388 Teil IV Der Top-Ten-Teil 391 Kapitel 15 (Nicht ganz) Zehn erstaunliche jQuery-Plugins 393 Die Plugins verwenden 393 IPWEditor 394 Einen einfachen Editor mit editable hinzufugen 394 Fortgeschrittenere Bearbeitungsmoglichkeiten mit FCKedit 397 jQuery-Cookies 401 flot 403 Tag-Cloud 405 Tablesorter 407 Droppy 410 galleria 413 jmp3 415 Kapitel 16 (Mehr als) Zehn grossartige Quellen 419 jQuery-PHP-Bibliothek 419 JSAN -- JavaScript Archive Network 419 W3Schools -- Einheiten fur ein Selbststudium und Beispiele 419 Google AJAX APIs 420 Aflax 420 MochiKit 420 Dojo 420 Ext JS 421 YUI 421 DZone 421 AJAX-Community 421 Dokuwelt.de 421 AJAX-Quellensammlung von DrWeb.de 422 JavaScript-Bibliothekensammlung von DrWeb.de 422 JavaScript-Forum bei jswelt.de 422 Stichwortverzeichnis 423
