Webdesign - Webseiten planen, gestalten - Free-Hack Library

Weiterführende Technologien
Ajax ermöglicht Websites ein Maß an Interaktion, das bislang nur
Desktop-Anwendungen vorbehalten war. Nach Erscheinen des
Artikels „Ajax: A New Approach to Web Applications“ von Jesse
James Garret wurde Ajax insbesondere durch diverse Google-
Anwendungen extrem populär.
Übungsexkurs Ajax
Bei der Anwendung, die in diesem Exkurs programmiert wird,
handelt es sich um eine einfache Funktion, die nach Auswahl
eines Bildnamens das entsprechende Bild ausgibt. Dazu ist weder
ein Abschicken per Submit-Button noch ein erneutes Laden der
Seite erforderlich.
Das XHTML-Gerüst in der Anwendung besteht anfangs nur aus
einer Klappliste ohne Funktion, die in den weiteren Schritten
durch Ajax erweitert wird.
Welches Bild möchten Sie sehen?
Blatt mit Rauhreif
Blatt mit Regentropfen
Gefrorene Steine
.
Kern der JavaScript-Anwendung ist das XMLHttpRequest-Objekt,
das zur Kommunikation und zum Datenaustausch zwischen Client
und Server dient. Dieser von JavaScript initiierte Zugriff auf den
Server erfolgt asynchron.
var responseObject;
if(navigator.appName.search("Microsoft") > -1) {
//responseObject = new ActiveXObject("Microsoft.
XMLHTTP");
responseObject = new ActiveXObject("MSXML2.XMLHTTP");
} else {
responseObject = new XMLHttpRequest();
}
Die sendRequest()-Funktion soll die Anfrage an das bislang noch
nicht vorhandene PHP-Dokument senden. Dazu sendet es die ID
des gewünschten Bildes an das PHP-Skript und bittet um Ausgabe
des Fotos.
TECHNISCHE
GRUNDLAGEN
4
Abb. 4.7.9c: Die mit HTML umgesetzte Klappliste
121