Anzeige
Tutorialbeschreibung

Basiswissen JavaScript/DOM Teil2b - Sprachkonzepte von JavaScript

Basiswissen JavaScript/DOM Teil2b - Sprachkonzepte von JavaScript

JavaScript ist eine Programmiersprache, die sich ähnlich wie CSS in HTML integrieren lässt und wie CSS vom Browser ausgeführt wird. Sie erlaubt während der Anzeige einer Webseite beim Anwender dynamische Änderungen am Inhalt und Erscheinungsbild der Seite sowie einfache Benutzerinteraktion. Das Document Object Model (DOM) ist dabei der Standard für den dynamischen Zugriff auf HTML-Elemente, für die Steuerung von Anwenderereignissen usw.


Das nun folgende Tutorial ist ein Auszug aus dem Buch: Professionelle Websites von Stefan Münz.
Die Veröffentlichung des Kapitels erfolgt mit freundlicher Genehmigung von Pearson Education .


3.7 Die Objektstruktur von JavaScript 1.5


Wir haben nun die wichtigsten syntaktischen Regeln von JavaScript kennen gelernt. Jetzt wird es darum gehen, auf was man mit JavaScript eigentlich zugreifen kann. Auf Inhalte der aktuell angezeigten HTML-Seite im Browser kann über DOM-Syntax zugegriffen werden. Wir haben aber auch schon Beispiele vorgestellt, in denen das aktuelle Datum oder eine Zufallszahl ermittelt wurde.

Für all diese »Leistungen« stellt JavaScript ein Set an vordefinierten Objekten zur Verfügung. Um mit den Objekten arbeiten zu können, müssen Sie wissen, welche Objekte für welche Aufgabenbereiche zuständig sind, welche Eigenschaften und Methoden sie besitzen und wie mit ihnen gearbeitet werden kann.
Alle von JavaScript zur Verfügung gestellten Objekte mit Ausnahme von allem, was mit DOM zu tun hat, gehören zum so genannten Core (Kern) von JavaScript 1.5. Dazu zählen Objekte für Zeit und Datum, mathematische Operationen, Zeichenmanipulation, Serienvariablen (Arrays), Fensterzugriff (Popups, Frames) usw.

Wir werden auf die wichtigsten Objekte eingehen und beschreiben, wie Sie damit arbeiten können.

Objekte, Instanzen, Methoden und Eigenschaften
Zu den meisten Objekten gehören objektspezifische Eigenschaften und Methoden. Auf Eigenschaften und Objekte wird über den Punktoperator zugegriffen.

Schema:

Objekt.Eigenschaft
Objekt.Methode()

Eine Objekteigenschaft ist nichts anderes als eine Variable, die zum Objekt gehört, und eine Objektmethode ist nichts anderes als eine Funktion, die zum Objekt gehört. Bei einigen Objektmethoden kommt es daher auch vor, dass diese Parameter erwarten und Return-Werte zurückgeben.
Manche Eigenschaften können geändert, manche dagegen nur gelesen werden. Eigenschaften, die geändert werden dürfen, können also auch links von einer Zuweisung notiert werden, z.B. die bereits bekannte innerHTML-Eigenschaft des DOM-Objekts für HTML-Elemente. Nur lesbare Eigenschaftswerte dürfen dagegen nur rechts einer Zuweisung stehen, also zugewiesen werden, z.B. document.URL.

Mit manchen Objekten kann direkt gearbeitet werden (z.B. mit dem Math-Objekt). Deshalb ist es erlaubt, im JavaScript-Code ohne weiteres eine Objektmethode wie Math.random() aufzurufen.

Andere Objekte erfordern es, zuerst eine so genannte Instanz zu erzeugen (z.B. das Date- Objekt oder das Array-Objekt). Instanzen sind »Arbeitskopien« eines Objekts. Die Objektinstanz wird in einer frei benennbaren Variable gespeichert, die dann auch als Objektvariable bezeichnet wird.

Ein Beispiel für das Date-Objekt:

var now = new Date();
document.write(now.getFullYear());

In diesem Beispiel ist now die Objektvariable. In ihr wird durch Initialzuweisung des so genannten Konstruktors new Date() eine neue Instanz des Date-Objekts gespeichert. Über die Objektvariable ist anschließend der Zugriff auf Eigenschaften und Methoden des Objekts möglich. Im Beispiel ist getFullYear() eine Methode des Date-Objekts, die aber nur über eine Objektinstanz, wie es bei now der Fall ist, aufgerufen werden kann.
Objekte können Unterobjekte enthalten. Unterobjekte unterscheiden sich syntaktisch nicht von Objekteigenschaften. Erkennbar sind sie letztlich erst, wenn auf ihre Eigenschaften und Methoden zugegriffen wird.
Das Schema sieht dann so aus:

Objekt.Unterobjekt.Eigenschaft
Objekt.Unterobjekt.Methode()

3.8 Datum und Zeit mit JavaScript

Wenn Sie in JavaScript beispielsweise auf das aktuelle Datum und die aktuelle Uhrzeit zugreifen oder ermitteln möchten, auf welchen Wochentag der 31.12.2004 fiel, dann benötigen Sie das Date- Objekt.
Das Date-Objekt erfordert eine Instanz, um auf seine Eigenschaften und Methoden zugreifen zu können. Beim Initialisieren der Objektvariable haben Sie die Auswahl, ob Sie ein Datumsobjekt für den aktuellen Zeitpunkt wünschen oder ob das Datumsobjekt für einen beliebigen bestimmten Zeitpunkt in der Vergangenheit oder Zukunft erstellt werden soll. In der Praxis wird meistens nur eine Objektinstanz für den aktuellen Zeitpunkt benötigt, weil beispielsweise das aktuelle Datum ausgegeben werden soll oder ausgehend vom aktuellen Datum etwas berechnet werden soll, etwa die Anzahl der restlichen Tage im Jahr. Wenn Sie dagegen den Wochentag eines vergangenen oder künftigen Datums ermitteln möchten, müssen Sie beim Initialisieren der Objektvariable das gewünschte Datum übergeben.

Wenn Sie eine Objektinstanz für den aktuellen Zeitpunkt möchten, notieren Sie die Initialisierung einfach wie folgt:

var now = new Date();

Dabei können Sie anstelle von now auch einen anderen Namen vergeben.

Wenn Sie eine Objektinstanz für ein bestimmtes Datum benötigen, wobei aber die Uhrzeit keine Rolle spiel, ist die folgende Variante sinnvoll:

var last_day_2004 = new Date(2004,11,31);

In diesem Beispiel ist last_day_2004 der frei gewählte Name der Objektvariable. Bei der Konstruktor-Funktion Date() werden drei Parameter übergeben. Der erste ist das gewünschte Jahr, der zweite der Monat und der dritte der Tag im Monat. Beim zweiten Parameter ist zu beachten, dass für Monate Werte zwischen 0 und 11 übergeben werden müssen (und nicht wie im Kalender üblich zwischen 1 und 12!). Der im Beispiel übergebene Wert 11 bedeutet also »Dezember«.

Wenn die Uhrzeit eine Rolle spielen soll, können Sie auch diese mit initialisieren:

var start_2005 = new Date(2005,0,1,0,0,0);

Dabei werden an Date() die Parameter Jahr, Monat, Tag, Stunden, Minuten, Sekunden übergeben. Das Beispiel definiert eine Objektinstanz für den 1. Januar 2005, 0:00:00 Uhr.

Der im Objekt anfänglich gespeicherte Zeitpunkt ist durch die set...-Methoden des Date- Objekts im Programmverlauf veränderbar.

Methoden des Date-Objekts
Das Date-Objekt stellt diverse Methoden bereit, um Einzelwerte des gespeicherten Datums oder der Uhrzeit zu ermitteln oder zu verändern. Außerdem werden noch ein paar Konvertierungsmethoden bereitgestellt.

Über die Variable der Objektinstanz ist der Zugriff möglich, also etwa now.getDate() oder start_2005.parse().

Bilder


Anwendungsbeispiel: Datums-/Uhrzeit-Anzeige

Wir erweitern die in Abschnitt 7.2.3 vorgestellte Funktion dahin gehend, dass diese nun nicht nur einmalig das aktuelle Datum in ein gewünschtes Element schreibt, sondern jede Sekunde Datum und Uhrzeit. Der JavaScript-Code der Funktion lautet:

Bilder


Bilder

Abbildung 7.8: Sekündlich aktualisierte Datum-Uhrzeit-Anzeige

Die Funktion heißt nun show_clock() und erwartet als Parameter den id-Namen eines HTML- lements, als dessen Elementinhalt die Datums-/Uhrzeit-Anzeige laufend neu geschrieben werden soll. Im abgebildeten Beispiel wurde in HTML Folgendes notiert:

<div id="running_clock" style="font-size:16px; font-weight:bold; color:red"></
div>

Ein leeres div-Element also mit dem id-Namen running_clock. Aufgerufen wird die Funktion show_clock() am besten im einleitenden <body>-Tag mit onLoad=. Im abgebildeten Beispiel:

<body onLoad="show_clock('running_clock')">

Innerhalb der Funktion wird zunächst ein Array mit den deutschen Wochentagnamen definiert. Anschließend wird mit now = new Date() eine Instanz des Date-Objekts für den aktuellen Zeitpunkt erzeugt. Die einzelnen Bestandteile des Zeitpunkts, also Tag, Monat, Jahr, Stunden, Minuten und Sekunden, werden daraufhin über die entsprechenden get...-Methoden des Objekts ermittelt und in Variablen gespeichert.
Die fünf Anweisungen, die Variablen mit einer 0 am Ende des Namens initialisieren, dienen dazu, führende Nullen zu erzeugen, falls der Return-Wert einer der get...-Methoden kleiner als 10 war. Nur so kann später beispielsweise das Datum in der Form 05.02.2005 dargestellt werden.

Das Konstrukt, das beim Erzeugen der führenden Nullen erzeugt wird, ist übrigens eine Spezialform von Kontrollstruktur, die im Prinzip eine if-else-Verzweigung leistet, jedoch in verkürzter Form und ohne die bekannten Schlüsselwörter. Das Statement hat die folgende Form:

Bedingung ? if-Zweig : else-Zweig;

Jeder der beiden Zweige kann nur aus einer Anweisung bestehen. Das kann natürlich auch ein Funktionsaufruf sein. In unserer Funktion wird beispielsweise der Variablen day0 im if-Zweig, also wenn day kleiner als 10 ist, die Zeichenkette 0 zugewiesen, und im else- Zweig eine leere Zeichenkette. Bei anderen dieser Statements werden auch gleich die Trennzeichen zwischen den Datums-/Uhrzeit-Bestandteilen, also Punkte und Doppelpunkte, in diese Variablen eingefügt.

In der Variablen output wird schließlich die gesamte, auszugebende Zeichenkette zusammengebaut. Dabei wird auch der Wochentag mit berücksichtigt. Anschließend wird durch Zuweisung an die innerHTML-Eigenschaft des gewünschten HTML-Elements der Inhalt von output dynamisch ins Browser-Fenster geschrieben.
In der letzten Anweisung ruft sich die Funktion show_clock() selber wieder auf, und zwar mit einer Zeitverzögerung von 1000 Millisekunden, also von einer Sekunde. Auf diese Weise wird die Datums-/Uhrzeitanzeige jede Sekunde aktualisiert, solange die Seite angezeigt bleibt.

3.9 Mathematische Operationen mit JavaScript

Das Math-Objekt stellt Eigenschaften und Methoden zur Verfügung, die das Rechnen mit JavaScript erweitern und über die Möglichkeiten von Grundrechenarten hinausgehen. Eine Objektinstanz ist beim Math-Objekt nicht erforderlich – seine Eigenschaften und Methoden können direkt mit Math.Eigenschaftsname bzw. Math.Methodenname() angesprochen werden.

Eigenschaften des Math-Objekts
Die Eigenschaften des Math-Objekts sind eigentlich nur bekannte mathematische Konstanten. Keine der Eigenschaft ist daher änderbar.

Bilder


Methoden des Math-Objekts
Die Methoden des Math-Objekts erlauben beispielsweise trigonometrische Berechnungen, Ganzzahlrundung und die bereits bekannte Ermittlung einer Zufallszahl.

Bilder


Anwendungsbeispiel: Kaufmännisches Runden mit Nachkommastellen

Jede numerische Variable in JavaScript stellt ein eigenes Objekt dar, auf das sich unter anderem eine Methode namens toFixed() anwenden lässt. Diese erzwingt für den Wert der Variablen eine fixe Anzahl von Nachkommastellen. Dies ist ein häufiger Praxiswunsch, wenn etwa aus einer Berechnung von Werten, die ein Anwender eingegeben hat, ein Preis ermittelt werden soll und dieser aber mit genau zwei Nachkommastellen angezeigt werden soll. Nun schneidet toFixed() einfach zu viele Nachkommastellen ab. Gerade bei Preisen jedoch wird meist eine kaufmännische Rundung erwünscht.

Die nachfolgende, allgemein geschriebene Funktion erlaubt das Runden auf eine gewünschte Anzahl Nachkommastellen (inklusive 0 für keine Nachkommastellen) und rundet dabei kaufmännisch auf:

function round_float(x, pdp) {
x *= Math.pow(10, pdp);
y = Math.round(x);
y /= Math.pow(10, pdp);
return(y.toFixed(pdp));
}

Die Funktion round_float() erwartet zwei Parameter. Der erste, x, ist eine Zahl, die kaufmännisch gerundet werden soll. Der zweite Parameter, pdp, ist die Anzahl Nachkommastellen, die ausgegeben werden sollen.

Die Funktion bedient sich eines Tricks. Wenn man beispielsweise den Wert 3.267 kaufmännisch runden möchte, und zwar mit zwei Nachkommastellen, dann ist dies erreichbar, indem man die Zahl mit 100 multipliziert (Ergebnis: 326.7), diesen Wert ganzzahlig rundet (Ergebnis: 327) und das Ergebnis dann wieder durch 100 dividiert (neues Ergebnis: 3.27).
Genau das tut die obige Funktion mit den ersten drei Anweisungen. Da jedoch die Anzahl gewünschter Nachkommastellen nicht fest steht, sondern mit dem Parameter pdp übergeben wird, arbeitet die Funktion mit Math.pow(). Damit wird x mit einer Potenz von 10 multipliziert, wobei die Potenz durch den Parameter pdp festgelegt wird. In der zweiten Anweisung wird das so entstandene Zwischenergebnis mit Math.round() ganzzahlig gerundet. In der dritten Anweisung wird das gerundete Ergebnis wieder durch die gleiche Zehnerpotenz geteilt, wie zuvor multipliziert wurde.
Das Ergebnis stimmt nun zwar, enthält aber bei weniger Nachkommastellen als gewünscht keine Nullen am Ende. Ein Aufruf wie round_float(4.097, 2)ergibt bis dahin nur 4.1, nicht 4.10. Um Letzteres zu erreichen, gibt die Funktion nicht einfach y zurück, sondern wendet nun noch einmal die toFixed()-Methode auf y an, und zwar mit so viel gewünschten Nachkommastellen wie in pdp angegeben. Dieser Wert wird mit return an eine aufrufende Anweisung zurückgegeben.

3.10 Zeichenketten (Strings) in JavaScript

Zeichenketten können aus einem einzigen, aber auch aus sehr vielen Zeichen bestehen. So liefert etwa document.getElementsByTagName('html')[0].innerHTML den gesamten HTMLQuelltext zwischen <html> und </html> in einer einzigen Zeichenkette. Eine Eigenschaft und diverse Methoden unterstützen bei der Programmierung dabei, Zeichenketten zu verarbeiten.

Das Zeichenkettenobjekt erfordert keine explizite Instanz. Stattdessen ist jede Variable, in der eine Zeichenkette gespeichert ist, automatisch auch eine Instanzvariable des Zeichenkettenobjekts. Wenn Sie also beispielsweise eine Variable namens name haben, können Sie z.B. mit name.length die Anzahl der darin gespeicherten Zeichen ermitteln, oder mit name.toLowerCase() alle darin enthaltenen Großbuchstaben in Kleinbuchstaben umwandeln.

Eigenschaften des Zeichenketten-Objekts
Die einzige Eigenschaft ist length. Diese Eigenschaft kann nicht geändert werden und enthält die Anzahl Zeichen der Zeichenkette.

Methoden des Zeichenketten-Objekts
Die Methoden des Zeichenketten-Objekts erlauben Zeichenkettenmanipulation und Durchsuchung. Einige Methoden arbeiten mit regulären Ausdrücken. Dieses Thema behandeln wir jedoch nicht in Zusammenhang mit JavaScript, sondern erst bei PHP.

Bilder

Einige der Methoden arbeiten mit Zeichenpositionen, wobei jeweils von »0-index-basiert« die Rede ist. Damit ist Folgendes gemeint: Das erste Zeichen einer Zeichenkette hat die Position 0. Das zweite hat die Position 1, das dritte die Position 2 usw. Wenn man also das 22. Zeichen meint, ist dessen Index innerhalb der Zeichenkette 21.

Anwendungsbeispiel: Horizontaler Courier-Ticker

Die Metapher »Börsenticker« erfreut sich auf vielen Websites immer noch großer Beliebtheit, um »brandaktuelle Neuigkeiten auf der Site« optisch auffällig zu präsentieren. Im nachfolgenden Beispiel zeigen wir, wie Sie einen einfachen Ticker dieser Art mit Java- Script realisieren. Der vollständige Quelltext des HTML-Dokuments mit dem Script lautet:

Listing 7.7: HTML-Dokument mit Ticker
Bilder


Bilder

Abbildung 7.9: JavaScript-basierter Ticker in Aktion

Im body-Bereich des HTML-Dokuments wird ein div-Bereich mit id-Namen ticker definiert. Seine optische Erscheinung und Position wird im zentralen style-Bereich im Dateikopf festgelegt. Im einleitenden <body>-Tag wird über den Event-Handler onload=, also wenn das Dokument geladen ist, die JavaScript-Funktion show_ticker() aufgerufen. Ihr werden zwei Parameter übergeben. Der erste Parameter ist der gewünschte Lauftext, der zweite Parameter nennt die Anzahl Millisekunden von einem Bewegungszustand des Lauftextes zum nächsten. Je höher dieser Wert, desto langsamer der Lauftext, und je niedriger, desto schneller.
Die Funktion show_ticker() steht im script-Bereich, der in den HTML-Kopfdaten notiert ist.

Die Logik des Lauftextes ist Folgende: Es gibt zwei »Basiszustände«, nämlich einen Zustand, in dem gar nichts von dem Text zu sehen ist, und einen, in dem der Text vollständig zu sehen ist. Ist der Text nicht zu sehen, soll er von rechts her Zeichen für Zeichen aufgebaut werden, so lange, bis er vollständig zu sehen ist. Dann soll er nach links hinaus Zeichen für Zeichen wieder verschwinden. Diese beiden »Bewegungsarten« sind aus programmiertechnischer Sicht sehr verschieden. Im ersten Fall muss nämlich die anzuzeigende Zeichenkette führende Leerzeichen enthalten und hinten den Teil des schon sichtbaren Textes. Im zweiten Fall dagegen muss die anzuzeigende Zeichenkette erst den noch sichtbaren Text enthalten und hinten Leerzeichen. Die »Bewegungsart« wird in unserem Script in der Variablen effect gespeichert. Diese Variable kann zwei Werte annehmen: rtl und ltn. Bei rtl soll der Text von rechts hereinwandern und bei ltn nach links hinaus.

Da der Text von rechts hereintickern soll und zunächst gar nicht zu sehen ist, besteht die Aufgabe also zunächst darin, ihn zeichenweise von rechts her aufzubauen. Dazu wird effect beim Einlesen des Scripts auf rtl gesetzt. Die Funktion show_ticker() besteht hauptsächlich aus einer if-else-if- Verzweigung, die den Zustand von effect abfragt. In den if-Zweig gelangt der Interpreter, wenn der Text von rechts herein aufgebaut werden soll, und in den else-if-Zweig, wenn er nach links hinaus verschwinden soll.

In der Variablen chars wird die Anzahl der aktuell sichtbaren Zeichen des Tickertextes gespeichert. Beim Einlesen wird diese Variable mit 0 initialisiert. Wenn der Text sich von rechts her zeichenweise aufbaut (rtl), nimmt die Zeichenzahl bei jedem Schritt zu. Deshalb wird chars im if- Zweig um 1 erhöht. Anschließend müssen die führenden Leerzeichen erzeugt werden, und zwar so viele, wie der Tickertext an Zeichen hat, abzüglich der Zeichen, die davon bereits angezeigt werden – ausgedrückt durch text.length - chars. Das Ergebnis wird einer Hilfsfunktion namens fill() als Parameter übergeben. Diese Funktion tut nichts anderes, als eine Zeichenkette zu erzeugen und mit so vielen erzwungenen Leerzeichen (&nbsp;) zu füllen wie im Parameter n übergeben wurde. Dazu wird die zu erzeugende Zeichenkette empty_chars in einer for-Schleife nach und nach um je ein Leerzeichen erweitert. Am Ende wird der Leerzeichen-String mit return zurückgegeben.

Die Funktion show_ticker() fängt den Rückgabewert von fill() auf, indem sie die den Aufruf der Funktion fill() der Variable text_now als Wert zuweist. In text_now stehen anschließend so viele Leerzeichen, wie von fill() erzeugt wurden. Fehlt noch, die anzuzeigenden Zeichen des Tickertextes an text_now anzuhängen. Dazu wird mit der substring()- Methode des Zeichenkettenobjekts die gewünschte Teilzeichenkette des Tickertextes extrahiert. text.substring(0, chars) bedeutet: »Ermittle aus dem Wert des Parameters text die Teilzeichenkette, die bei Position = (= erstes Zeichen) beginnt, und extrahiere so viele Zeichen, wie in chars gespeichert ist.«

Da chars immer wieder um 1 erhöht wird, muss am Ende geprüft werden, ob chars mittlerweile die Länge des gesamten Tickertextes erreicht hat. Ist das der Fall, wird effect auf ltn gesetzt. Der Interpreter gelangt ab dann in den if-else-Zweig, wo text_now umgekehrt gefüllt wird.

Am Ende der Funktion wird der aktuelle Inhalt von text_now mit der innerHTML-Eigenschaft dynamisch in das HTML-Element mit dem id-Namen ticker geschrieben. Zuletzt ruft sich die Funktion show_ticker() selbst wieder auf, und zwar mit den gleichen Parametern, die sie beim Erstaufruf übergeben bekommen hat. Da die Variablen chars und effect global, also außerhalb von Funktionen, deklariert wurden, bleibt ihr Wert erhalten und show_ticker() kann beim nächsten Durchlauf mit deren aktuellen Werten arbeiten.

3.11 Arrays in JavaScript

Arrays sind Speicherbereiche für Serienwerte, die einen gemeinsamen Variablennamen haben. Um einen Array zu erzeugen, müssen Sie eine Instanz des Array-Objekts in einem frei wählbaren Variablennamen erzeugen.

Die einfachste Möglichkeit zeigt das folgende Beispiel:

var month_names = new Array();

Damit wird ein leerer Array erzeugt.

Ebenso ist es aber möglich, einen Array gleich mit gewünschten Werten zu initialisieren.

Das sieht dann wie im folgenden Beispiel aus:

var month_names = new Array("Januar", "Februar", "März", "April", "Mai", "Juni",
"Juli", "August", "September", "Oktober", "November", "Dezember");

Die einzelnen Werte werden innerhalb der Klammern hinter new Array notiert. Zeichenkettenwerte werden wie üblich in hohe Anführungszeichen eingeschlossen, numerische Werte nicht. Die Einzelwerte werden durch Kommata voneinander getrennt.

So wie im zweiten Beispiel initialisiert, können Sie über Indexnummern auf die Einzelwerte zugreifen. Dabei wird bei 0 mit dem Zählen begonnen, d.h., das erste Array- Element hat den Index 0, das zweite den Index 1, das dritte den Index 2 usw. Die Indexnummern werden in eckigen Klammern notiert.

Ein Beispiel:

var month = month_names[5];

Anschließend ist in month das sechste Element aus dem Array month_names gespeichert, also der Wert Juni.

Auch schreibend kann auf Array-Elemente zugegriffen werden, und zwar auch dann, wenn die Elemente bislang gar nicht existieren. Dadurch wird das entsprechende Element einfach automatisch angelegt. Im folgenden Beispiel nutzen wir dies, um eine Methode zum Füllen eines leeren Arrays zu zeigen:

month_names = new Array();
month_names[0] = "Januar";
month_names[1] = "Februar";
month_names[2] = "März";
month_names[3] = "April";
month_names[4] = "Mai";
month_names[5] = "Juni";
month_names[6] = "Juli";
month_names[7] = "August";
month_names[8] = "September";
month_names[9] = "Oktober";
month_names[10] = "November";
month_names[11] = "Dezember";

Durch Zuweisung eines Werts an ein über die Indexnummer bestimmtes Array-Element wird dieses Element geändert.

Nun ist es mitunter lästig, mit Indexnummern zu arbeiten. Als Alternative besteht die Möglichkeit so genannter assoziativer Arrays. Dabei werden anstelle von Indexnummern Indexnamen vergeben:

month_names = new Array();
month_names["jan"] = "Januar";
month_names["feb"] = "Februar";
month_names["mar"] = "März";
month_names["apr"] = "April";
month_names["may"] = "Mai";
month_names["jun"] = "Juni";
month_names["jul"] = "Juli";
month_names["aug"] = "August";
month_names["sep"] = "September";
month_names["oct"] = "Oktober";
month_names["nov"] = "November";
month_names["dec"] = "Dezember";

Die gewünschten Indexnamen werden innerhalb der eckigen Klammern wie Variablennamen für die Einzelelemente vergeben. Im Beispiel lässt sich anschließend etwa mit month_names["aug"] auf den Wert August zugreifen.

Arrays können auch verschachtelt sein. Dazu wird einem Array-Element anstelle eines einzelnen Werts einfach wieder ein Array-Objekt zugewiesen.

Beispiel:

table_cells = new Array();
for(i = 0; i < 10; i++)
table_cells[i] = new Array();

Mit diesem Konstrukt wird der potenzielle Datenspeicher einer Tabelle angelegt. Die Tabelle besteht aus Zellen, jedoch nicht linear, sondern zweidimensional. Dazu werden im Beispiel in einer for-Schleife insgesamt zehn Array-Elemente von table_cells mit dem Wert »neuer Array« initialisiert. Anschließend kann über Notationen wie table_cells[2][6] etwa auf das siebte Serienelement des dritten übergeordneten Serienelements zugegriffen werden.

Eigenschaften des Array-Objekts
Die einzige Eigenschaft ist length. Diese Eigenschaft kann nicht geändert werden und enthält die Anzahl der Elemente im Array. Sehr praktisch ist diese Eigenschaft etwa, um gezielt das letzte Array-Element anzusprechen: month_names[month_names.length-1] greift beispielsweise auf das letzte Element im Array month_names zu.

Methoden des Array-Objekts
Die Methoden des Array-Objekts ermöglichen das bequeme Manipulieren von Arrays sowie attraktive Sonderfunktionen wie Sortierung oder Umwandlung in Zeichenketten. Methoden werden auf den Array-Variablennamen angewendet. Wenn ein Array also beispielsweise mit month_names = new Array(...) initialisiert wurde, ist eine Notation wie month_names.pop() möglich.

Bilder


Anwendungsbeispiel: Sortierte Lottozahlenreihe mit Zusatzzahl

Das Beispiel erzeugt sieben unterschiedliche Zufallszahlen zwischen 1 und 49. Die ersten sechs davon werden numerisch sortiert. Die letzte Zahl gilt als Zusatzzahl. Die erzeugte Reihe plus Zusatzzahl wird am Ende ausgegeben.
So einfach die Aufgabenstellung zunächst klingt, so wenig trivial ist eine ordentliche Lösung. Das nachfolgende Beispiel zeigt eine Lösung. Dabei wird intensiv mit Arrays gearbeitet.

Listing 7.8: Numerisch sortierte Lottozahlenreihe inklusive Zusatzzahl mit JavaScript
Bilder


Bilder

Abbildung 7.10: Numerisch sortierte Lottozahlenreihe inkl. Zusatzzahl mit JavaScript

Im body-Bereich des HTML-Dokuments ist ein script-Bereich notiert. Dieser enthält zunächst zwei Hilfsfunktionen. Die erste, in_array(), durchsucht einen Array in einer for- Schleife nach einem Wert. Wird der Wert gefunden, so wird die Indexnummer des gefundenen Elements zurückgegeben. Wird kein Element mit dem Wert gefunden, so wird -1 zurückgegeben. Als ersten Parameter erwartet in_array() den zu durchsuchenden Array und als zweiten Parameter den Wert, nach dem gesucht werden soll.

Die zweite Hilfsfunktion, numsort(), ist eine Hilfsfunktion, die wir zum Sortieren von numerischen Werten benötigen. Die Funktion gibt einfach das Ergebnis der Subtraktion des zweiten vom ersten übergebenen Parameter zurück. Das Ergebnis ist entweder positiv, 0 oder negativ. Diesen Input kann die sort-Methode des Array-Objekts verarbeiten.
Der Rest des Scripts steht außerhalb jeder Funktion und wird daher gleich beim Einlesen ausgeführt. Zunächst wird in lotto_series eine Instanz des Array-Objekts gespeichert, also ein neuer Array erzeugt.

Anschließend werden in einer for-Schleife insgesamt sieben Zufallszahlen erzeugt. Jede Zahl sollte eine Ganzzahl zwischen 1 und 49 sein. Sichergestellt wird dies durch das Berechnungskonstrukt Math.round(Math.random() * 49). Allerdings kann es immer noch vorkommen, dass zwei gleiche Zahlen vorkommen. Um dies zu verhindern, muss, sobald bereits eine oder mehrere Zahlen im Array sind (lotto_series.length > 1), überprüft werden, ob die neu ermittelte Zufallszahl schon vorkommt. Dazu wird in_array() aufgerufen. Außerdem soll verhindert werden, dass die Zahl 0 als Zufallszahl ermittelt wird. Aus beiden Wünschen wird eine Bedingung für eine while-Schleife gebastelt. Innerhalb der while-Schleife wird nochmals ein neuer Zufallswert als Ganzzahl kleiner oder gleich 49 ermittelt. Das wird gegebenenfalls so oft wiederholt, wie eine der Bedingungen erfüllt ist (Wert kommt schon vor oder Wert ist 0).
Ist alles in Ordnung, dann wird dem Array lotto_series mit der push()-Methode der neue Zufallswert angehängt.

Die ersten sechs der sieben ermittelten Zahlen sollen die reguläre Lottoreihe bilden. Die siebte Zahl soll die Zusatzzahl sein. Die ersten sechs Zahlen sollen sortiert ausgegeben werden. Dazu werden zunächst mithilfe der slice()-Methode die ersten sechs der sieben Zahlen aus lotto_series extrahiert und in lotto_series_6 gespeichert. Dieser Array wird anschließend mit der sort()-Methode sortiert – und zwar numerisch. Da die sort()- Methode normalerweise alphanumerisch sortiert, würden beispielsweise Folgen wie 15, 2, 25, 3, 31, 42 entstehen. Erst eine numerische Sortierung liefert wie gewünscht 2, 3, 15, 25, 31, 42. Damit die sort()-Methode numerisch sortiert, wird ihr der Funktionsname der Hilfsfunktion numsort() als Parameter übergeben. Nehmen Sie diese etwas ungewöhnliche Notation einfach als gegeben hin.
Zuletzt wird im Beispiel HTML-Code erzeugt, der die Zahlenreihe und die Zusatzzahl ausgibt.

3.12 Weitere Objekte, Eigenschaften und Methoden

Wir haben nun wichtige Standardobjekte von JavaScript 1.5 behandelt. JavaScript bietet eine ganze Reihe weiterer Objekte einschließlich Eigenschaften und Methoden an. Viele davon kommen in der Praxis jedoch kaum zum Einsatz und werden deshalb auch im Rahmen dieses Buchs nicht behandelt. Zahlreiche andere Objekte, Methoden und Eigenschaften gehören heute entweder zum DOM oder wurden durch andere DOM-Entsprechungen ersetzt. Einige sind auch ganz unter den Tisch gefallen, weil sie weder zu JavaScript 1.5 noch zum DOM gehören, obwohl sie eigentlich nützlich sind. In diesem Abschnitt behandeln wir daher quer Beet verschiedene Möglichkeiten, die Sie kennen sollten. Einst beliebte, aber aussterbende Möglichkeiten wie das Öffnen von Popup- Fenstern, das Verändern von Fensterposition oder Fenstergröße oder das Manipulieren der Statusleiste stellen wir bewusst nicht vor, da die entsprechenden Features auf professionellen Sites nichts mehr zu suchen haben.

Benutzerinteraktion mit einfachen Dialogfenstern
Als JavaScript-Programmierer haben Sie die Möglichkeit, einfache, vordefinierte Dialogfenster beim Anwender anzuzeigen, die dieser bestätigen bzw. bearbeiten kann. Drei solche Fenstertypen gibt es:

- Meldungsfenster: gibt einen Text aus. Der Anwender kann nur mit einer Schaltfläche für OK bestätigen. Gedacht, um wichtige Hinweise einzublenden.

Beispiel:

alert('Funktion noch nicht implementiert!');

Bilder


Die Methode alert() bekommt den gewünschten Meldungstext übergeben. Eine Anweisung wie im Beispiel könnte etwa an einer Stelle im Script stehen, die zwar schon erreichbar ist (z.B. durch Eingaben in einem Formular), aber noch nicht die gewünschte Funktionalität bietet.

- Bestätigungsfenster: gibt einen Text aus, der als Rückfrage zum Auslösen einer Aktion gedacht ist. Der Anwender kann mit einer Schaltfläche für Ja oder Nein bestätigen. Das Script bekommt übergeben, wie sich der Anwender entschieden hat.
Beispiel:

check = confirm("Wollen Sie diese Seite wirklich sehen?");
if(check == false) history.back();
else location.href = "gnadenlos.html"

Bilder


Die Methode confirm() bekommt den gewünschten Text übergeben. Der Aufruf wird einer Variablen zugewiesen. Die Variable enthält anschließend den Wert true, wenn der Anwender positiv bestätigt, oder den Wert false, wenn er den Dialog negativ quittiert.

- Eingabefenster: bietet ein Eingabefeld mit einem voranstehenden Text. Der Anwender kann einen Wert eingeben. Gedacht, um einzelne Daten vom Anwender einzuholen, ohne dafür ein HTML- Formular verwenden zu müssen.

Beispiel:

user_name = prompt("Wie heißen Sie?","");
document.write("<h1>Willkommen, " + user_name + "</h1>");

Bilder


Die Methode prompt() erwartet zwei Parameter. Der erste ist der gewünschte Fragetext, der zweite die Vorbelegung des Eingabefelds. Wenn Sie keine Vorbelegung wünschen, übergeben Sie wie im Beispiel eine leere Zeichenkette. Der Aufruf wird einer Variablen zugewiesen. Die Variable enthält anschließend als Zeichenkette den Wert, den der Anwender eingegeben hat.

Das Aussehen der Dialogfenster ist system- und browserspezifisch und kann nicht geändert werden.

Browser-Grundfunktionen wie Back, Forward, Stop, Reload und Drucken
JavaScript bietet die Möglichkeit, diese Browser-Grundfunktionen auszuführen. So ist es beispielsweise möglich, die entsprechenden Funktionen über einen Hyperlink anzustoßen. Das nachfolgende Beispiel definiert solche Hyperlinks:

<p>
<a href="javascript:history.back()">Seite zurück</a><br>
<a href="javascript:history.forward()">Seite vor</a><br>
<a href="javascript:stop()">Laden abbrechen</a><br>
<a href="javascript:location.reload()">Neu laden mit neuem
Hist.Eintrag</a><br>
<a href="javascript:location.replace()">Neu laden</a><br>
<a href="javascript:print()">Seite drucken</a>
</p>

Die Methoden stop() und print() gehören zum Fenster-Objekt von JavaScript die Methoden reload() und replace() zum location-Objekt und die Methoden back() und forward() zum history-Objekt von JavaScript vor Version 1.5. Browser interpretieren diese Objekte und Methoden noch. Wenn Sie Links wie im obigen Beispiel notieren, sollten Sie sich jedoch dessen bewusst sein, dass Anwender, die JavaScript deaktiviert haben, beim Anklicken solcher Links eine Fehlermeldung erhalten oder dass gar nichts passiert.

Wechsel zu anderer Seite
Über das location-Objekt von JavaScript ist es auch möglich, JavaScript einen Sprung zu einer anderen Seite ausführen zu lassen. In Zusammenhang mit den einfachen Dialogfenstern hatten wir bereits ein Beispiel dafür:

check = confirm("Wollen Sie diese Seite wirklich sehen?");
if(check == false) history.back();
else location.href = "gnadenlos.html"

Durch Zuweisung eines URI an location.href wird ein Sprung zum entsprechenden URI ausgeführt. Es kann sich um eine lokal referenzierte Quelle oder um eine absolute Internetadresse handeln. Durch den Sprung zur anderen Seite wird die aktuell angezeigte Seite verlassen. Das Script wird dadurch natürlich auch nicht weiter ausgeführt. Ein entsprechender Aufruf sollte also nur an geeigneten Stellen stehen.

Datenübergabe zwischen Seiten
Jedes JavaScript bezieht sich immer nur auf die aktuell angezeigte Seite. Variablen usw. gehen verloren, wenn eine neue Seite angezeigt wird. Eine Möglichkeit, Daten an eine nachfolgende Seite zu übergeben, besteht darin, in JavaScript einen GET-String zu basteln und diesen an Aufrufe der nächsten Seite in den URI einzubauen. Es existiert jedoch eine elegantere Methode. Im Fenster- Objekt von JavaScript gibt es eine Eigenschaft name, welche eigentlich den Namen eines Fensters speichert. Diese Eigenschaft kann gelesen und geändert werden. Sie hat den Vorteil, dass ihr Wert so lange stabil bleibt, wie das betreffende Fenster geöffnet ist. Da nun der Fenstername etwa des Browser-Hauptfensters völlig uninteressant ist, kann die Eigenschaft window.name hervorragend dazu genutzt werden, um Zeichenketten zu speichern. Das folgende Beispiel demonstriert eine Datenübergabe dieser Art:

Zunächst Seite 1:

Listing 7.9: Dokument mit Script für Datenübergabe
Bilder


Bilder

Abbildung 7.11: Formular für Eingabe eines zu speichernden Inhalts

Das Dokument enthält ein Formular mit einem Eingabefeld (id-Name text). Außerdem enthält das Formular einen Submit-Button mit der Aufschrift Speichern. Beim action-Attribut ist der URI einer Seite eingetragen, die aufgerufen werden soll, wenn der Anwender auf den Submit-Button klickt. Zuvor soll jedoch noch eine JavaScript-Funktion namens save_input() ausgeführt werden, die in einem script-Bereich im Dateikopf steht. Damit die Funktion noch ausgeführt wird, ist im einleitenden <form>-Tag der Event-Handler onsubmit= notiert. Dieses Ereignis tritt genau dann ein, wenn der Anwender das Formular absendet. Die Funktion save_input() liest den eingegebenen Wert aus dem Eingabefeld aus und speichert ihn in unserem zweckentfremdeten Datenspeicher window.name.
Die Anweisung return true ist notwendig, damit das Formular tatsächlich abgesendet und die bei action= angegebene Adresse aufgerufen wird.

Der Quelltext der zweiten Seite (js2.htm) lautet in unserem Beispiel:

Listing 7.10: Dokument mit Script für Datenauswertung
Bilder


Bilder

Abbildung 7.12: Ausgabe des in window.name gespeicherten Inhalts

Das Dokument liest in einem script-Bereich einfach den gespeicherten Wert von window. name aus und schreibt ihn ins Dokument.
Falls Sie beispielsweise Inhalte aus mehreren Formularfeldern sichern möchten, müssen Sie diese so zu einer einzigen Zeichenkette zusammenfügen, dass es im aufgerufenen Dokument wieder möglich ist, die Zeichenkette korrekt auseinander zu nehmen. Es bietet sich an, Einzelwerte in der zusammengesetzten Zeichenkette durch eine selbst definierte Trennzeichenfolge wie "|+|" zu trennen. Das aufgerufene Dokument kann dann mit einer Anweisung wie var fields = window.name.split("|+|") die einzelnen Werte in einem Array sammeln.

Seiten-Umgebungsinformationen
Über das document-Objekt von JavaScript lassen sich unter anderem wichtige Informationen zur aktuell angezeigten Seite ermitteln:

Bilder


Anwender-Umgebungsinformationen
Frühere JavaScript-Versionen erlaubten es, Umgebungsversionen wie Daten zum verwendeten Browser, Bildschirminformationen und installierte Plug-Ins abzurufen. Leider wurden diese Daten nur allzu oft dazu missbraucht, um dem Anwender etwas aufzuzwingen, wie etwa sein Browser- Fenster auf Bildschirmgröße zu trimmen, oder um wildes, proprietäres Zeug für bestimmte Browser zu programmieren. Die wichtigsten dieser Abfrageinformationen sollen hier vorgestellt werden, jedoch mit der Warnung, diese nicht zu missbrauchen.

Bilder


Vor allem Informationen des navigator-Objekts sind jedoch mit Vorsicht zu genießen. Einige Browser erlauben es, diese Daten zu konfigurieren, weshalb die Abfrage möglicherweise unbrauchbare und nicht klassifizierbare Ergebnisse liefert.

Ein sinnvolles Anwendungsbeispiel:

<img id="pic" alt="Bild">
<script type="text/javascript">
if(Math.pow(2,screen.colorDepth) >= Math.pow(2,16))
document.getElementById("pic").setAttribute("src",
"wueste.jpg");
else
document.getElementById("pic").setAttribute("src",
"wueste.gif");
</script>

Zunächst wird eine HTML-Grafikreferenz notiert, jedoch ohne src-Attribut. Das src-Attribut und damit die Entscheidung, welche Grafikdatei referenziert werden soll, bestimmt stattdessen JavaScript. Unterhalb der Grafikreferenz steht ein script-Bereich. Darin wird abgefragt, ob die Anzahl Farben am Anwenderbildschirm größer als oder gleich 65536 ist. Wenn ja, wird eine andere Grafikdatei angezeigt als im else-Fall.

Diverse objektunabhängige Funktionen
Neben den Default-Objekten von JavaScript gibt es einige wichtige Standalone-Funktionen. Nachfolgende Tabelle stellt die wichtigsten davon vor:

Bilder


3.13 Existenz von Objekten, Eigenschaften und Methoden

Da die Umsetzung von JavaScript in den verschiedenen Browsern uneinheitlich ist, ist es mitunter sinnvoll, abzufragen, ob ein Objekt, eine Eigenschaft oder eine Methode verfügbar ist, bevor man diese im Code anspricht. So lassen sich Fehler bei der Ausführung des Scripts vermeiden. Da sich die Situation bei den modernen Browsern bereits gebessert hat, sind nicht mehr ganz so viele Abfrageorgien erforderlich, wie es früher einmal der Fall war. Dennoch gehört es nach wie vor zum sauberen Programmierstil, zumindest bei solchen Objekten, Eigenschaften und Methoden auf Existenz zu prüfen, die es noch nicht so lange gibt.

Ein Beispiel:

function set_heading() {
if(!document.getElementById)
return;
now = new Date;
var text = now.getDate() + "." + (now.getMonth() + 1) + "." +
now.getFullYear();
document.getElementById("heading").innerHTML = text;
}

In dieser Funktion werden alle Browser, welche die typische und häufig benutzte DOMMethode document.getElementById nicht kennen, mit einem einfachen return sofort wieder aus der Funktion verbannt. Nur Browser, welche die Methode kennen, führen den restlichen Code in der Funktion aus.
Um die Existenz eines Objekts, einer Eigenschaft oder einer Methode abzufragen, wird der entsprechende Name einfach in einer if-Abfrage als Bedingung eingesetzt (bei Methoden ohne die runden Klammern). Jedes Objekt, jede Eigenschaft und jede Methode erzeugt intern bei Bekanntheit ein true, und wenn unbekannt, ein false.

Auf die gleiche Weise sind etwa folgende Anweisungen denkbar:

if(Array) {
var numbers = new Array(1,2,3,4,5);
if(numbers)
document.write(numbers.length);
if(numbers.toString)
document.write(numbers.toString());
}

Das Beispiel prüft zunächst, ob das Array-Objekt verfügbar ist, und legt abhängig davon eine Objektinstanz namens numbers an. Auch die Existenz von Objektinstanzen ist abfragbar. Das Beispiel fragt ab, ob numbers erfolgreich angelegt wurde, und gibt im Erfolgsfall die Anzahl der Elemente aus. Dann wird noch abgefragt, ob die allgemeine Objektmethode toString() für die Objektinstanz numbers verfügbar ist, welche den Objektinhalt in eine Zeichenkette verwandelt. Falls verfügbar, wird die Methode angewendet und ihre Zeichenkette ausgegeben.

3.14 Eigene Objekte, Eigenschaften und Methoden

JavaScript selbst präsentiert sich zwar weitgehend in Form von Objekten, Eigenschaften und Methoden, doch in der Praxis der JavaScript-Programmierung wird meist nicht streng objektorientiert programmiert, sondern eher strukturiert und funktionsorientiert im Sinne von klassischem C, oder auch einfach nur »Spaghetti-Code«. Das liegt sicherlich zum Teil daran, dass mit kaum einer Programmiersprache so viele unerfahrene Nicht-Programmierer in Berührung kommen wie mit JavaScript. Zum anderen begründet es sich aber auch dadurch, dass das objektorientierte Konzept von JavaScript 1.5 noch nicht wirklich konsequent und weitreichend genug ist. Erst JavaScript 2.0 soll »echtes« objektorientiertes Programmieren mit Features wie Vererbung, Kapselung usw. realisieren.

Dennoch ist es auch mit JavaScript 1.5 möglich, ansatzweise objektorientiert zu programmieren. Der Einsatz von Objekten empfiehlt sich vor allem dann, wenn komplexere Datenstrukturen angelegt werden sollen. An einem Beispiel soll die grundsätzliche Vorgehensweise erläutert werden. Das Beispiel enthält einen script-Bereich, der zwei Objekte mit Eigenschaften und einer Methode anlegt und den Zugriff darauf testet.

Bilder


Ein eigenes Objekt wird mithilfe einer gewöhnlichen Funktion erzeugt. Im Beispiel werden zwei Objekte erzeugt: team und member. Die Objektfunktionen team() und member(), auch als Konstruktorfunktionen bezeichnet, unterscheiden sich nur innerhalb des Funktionskörpers von gewöhnlichen Funktionen.
Innerhalb der Objektfunktion werden Eigenschaften und Methoden des Objekts deklariert. Eine Initialisierung ist möglich, aber nicht nötig. Die Deklaration von Eigenschaften und Methoden wird durch das Schlüsselwort this eingeleitet, gefolgt durch den Punktoperator. Dahinter folgt der Name, unter dem die Eigenschaft oder Methode angesprochen werden kann.

Im Beispiel des Objekts team werden zunächst drei gewöhnliche Eigenschaften deklariert, dann ein Array und zuletzt eine Methode. Bei Methoden wird zur Deklaration die Syntax this.Methodenname = Methode benutzt (ohne runde Klammern!). Dabei ist Methodenname der Name, unter dem die Methode später aufrufbar ist, und Methode der Name einer Funktion, welche den JavaScript-Code dieser Methode enthält. Methodenname und Methode können gleich lauten, müssen es aber nicht. In unserem Beispiel lauten sie gleich. Mit this.add_member = add_member wird eine Methode add_member deklariert. Die zugehörige Funktion add_member() ist etwas weiter unten im Script notiert.

Beim zweiten Beispielobjekt member werden lediglich drei Objekteigenschaften deklariert.

Um mit eigenen Objekten zu arbeiten, müssen Instanzen davon erzeugt werden. Dazu wird die Objektfunktion mit dem new-Operator aufgerufen. Im Beispiel wird mit var fire_lions = new team() eine Instanz des Objekts team in der Objektvariablen fire_lions gespeichert.

Über die Objektvariable ist anschließend der lesende und schreibende Zugriff auf Eigenschaften des Objekts nach dem Schema Objektvariable.Eigenschaft möglich, also über den Punktoperator.

Die Anweisung fire_lions.add_member(hs) in unserem Beispiel weiter unten demonstriert einen Zugriff auf eine Objektmethode. Auch diese verwendet den Punktoperator. Im Beispiel fügt die Methode add_member() das als Parameter übergebene Objekt vom Typ member in den Array members des team-Objekts hinzu. Der Array enthält also keine Zahlen oder Zeichenketten als Elemente, sondern ganze Objekte. Der Zugriff auf Einzeldaten daraus ist aber sehr wohl möglich, wie etwa fire_lions.members[0].gname zeigt.

Wie aus dem Beispiel deutlich wird, ist das Anlegen eigener Objekte vor allem hinsichtlich einer ordentlichen Datenstrukturierung zweckmäßig, ansonsten jedoch von keinem besonderen Nutzen.


 

Das Tutorial ist ein Auszug aus dem Buch von Stefan Münz:

Professionelle Websites - Programmierung, Design und Administration von Webseiten
Addison-Wesley, 2. Auflage, 1136 Seiten, gebunden, komplett in Farbe, mit DVD

Die Veröffentlichung des Kapitels erfolgt mit freundlicher Genehmigung von
Pearson Education.

Mehr Informationen zu diesem wunderbaren Fachbuch für Webmaster und Webentwickler
gibt es hier: Professionelle Websites

Alle Teile des Buches: 

1 Intro
2 HTML und CSS
3 Dynamische Seiten mit JavaScript/DOM
4 Die Server-Seite
5 PHP und MySQL
6 XML
7 Betrieb von Websites
8 Referenz
Bilder

 

DVD-Werbung
Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
Portrait von MaoMao
  • 09.01.2013 - 16:57

Gute Tutorial leicht erklärt.

x
×
×