1/4
INHALT

Der Weg nach Java (1/4)

JavaScript – wofür? (1/4)

Grundlagen (1/4)

Objects, Methods, Properties, Variabeln (2/4)

Events, Event Handlers (2/4)

Functions (2/4)

Wanzensuche (3/4)

Learning by doing (3/4)

Ausblick auf Teil 2 (3/4)

Event Handler (3/4)

Interessante Links zu JavaScript (4/4)

Beispiele in JavaScript:

JavaScript Workshop Teil 2

Tips - Übersicht

. JavaScript (Teil 1)

Java und JavaScript sind derzeit in aller Munde. Ohne die beiden scheint im Web nichts mehr zu gehen. Was hat es aber mit der einfachen Script-Sprache JavaScript auf sich? Was hat sie mit Java zu tun? Und vor allem: Was kann man damit machen, und wie? Lesen Sie unseren zweiteiligen Workshop!

Spätestens mit der Integration von JavaScript in die Version 3.0 von Microsofts Internet Explorer hat die Scriptsprache die proprietäre Netscape/Sun-Ecke verlassen und bietet sich dem Web-Entwickler als interessante Alternative an. Mit JavaScript lassen sich HTML-Seiten bei vergleichsweise geringem Programmieraufwand mit zahlreichen interessanten Funktionen und Animationen anreichern, ohne dass damit unnötig Bandbreite verschlungen wird.

Dieser Workshop behandelt die Grundlagen von JavaScript, geht auf die Sprachstruktur und -konzepte ein und soll dem Leser die Fähigkeiten vermitteln, einfache Scripts zu übernehmen und an die eigenen Bedürfnisse anzupassen. Er ist jedoch in keiner Weise in der Lage, das eingehende Studium von Netscapes Dokumentation oder eines einschlägigen Buches zu ersetzen (vgl. Link-Kasten). Primär soll eine Einführung geboten und das Interesse an dieser einfachen, aber mächtigen Programmiersprache geweckt werden.

Der Weg nach Java
JavaScript (im folgenden ‘JS’) hielt mit dem Navigator 2.0 Einzug in die Web-Gemeinde. Ursprünglich wurde die Scriptsprache von Netscape «Mocha» genannt, dann in «LiveScript» und schliesslich in «JavaScript» umgetauft. Der heutige Name hat zu einigen Verwirrungen geführt, indem er eine enge Verwandtschaft mit der Programmiersprache «Java» suggeriert. Und tatsächlich lehnt sich JS in der Syntax an Java an, ist aber wesentlich anspruchsloser im Aufbau und eingeschränkter in den Möglichkeiten. Die Scriptsprache ist eine Erweiterung von HTML und wird auch direkt in den HTML-Code geschrieben. Sie wird nicht kompiliert, sondern als Quellcode direkt vom Browser interpretiert. JS ist dennoch keine Seitenbeschreibungs-, sondern eine richtige Programmiersprache.

Es wurde bereits angesprochen, dass JS mit der Version 3.0 des Internet Explorer auch von Microsoft implementiert wurde, allerdings unter dem Namen JScript und neben der Microsoft-eigenen Scriptsprache Visual Basic Script (VBScript). Abgesehen von wenigen Unterschieden ist JScript mit der in Navigator 2.0 eingebauten Version identisch. Grundsätzlich lässt sich dazu sagen, dass alle Navigator-2.0-Features auch in Internet Explorer 3.0 funktionieren, während dieser bei allen Navigator-3.0-Features passen muss. Wenn nicht speziell darauf hingewiesen wird, können Sie davon ausgehen, dass die in diesem Workshop behandelten Scripts und Beispiele in allen genannten Browser-Versionen problemlos funktionieren.

In den Beispielen wird der Einfachheit halber auf die normalen HTML-Tags sowie die <SCRIPT>-Tags verzichtet, wenn sie für das Verständnis nicht notwendig sind. Die kompletten, in HTML-Seiten integrierten Beispiele finden Sie in hinter den Links.

JavaScript – wofür?
Im täglichen Leben im World-Wide Web wird JS immer wichtiger. Es gibt kaum noch eine professionelle Site, die kein Script in irgendeiner Form implementiert hat, sei es, um Formulare schon während der Eingabe zu überprüfen, Rechenaufgaben zu lösen oder mehrere Frames gleichzeitig zu aktualisieren. Weitere interessante Anwendungsmöglichkeiten für JS kommen mit dem Navigator 4.0 auf uns zu. Mit dieser neuen Version werden das absolute Positionieren von Web-Seitenelementen (Layers) und Style Sheets (JSS) eingeführt. Beide Technologien lassen sich über JS beeinflussen, dynamisch oder interaktiv verändern, animieren, etc. Sowohl Layers als auch JSS lassen sich zwar auch ohne Script nutzen, es wäre aber fast schade, die neuen Möglichkeiten nicht auszuschöpfen. Wir werden im zweiten Teil näher darauf eingehen.

Prinzipiell ist JS eine Ergänzung zu HTML, die verschiedene Löcher der Seitenbeschreibungssprache stopfen kann. Ihre Möglichkeiten und Anwendungsbereiche sind vielfältig:

• Formularüberprüfung: Sinnlose Eingaben in Formularen können schon während der Eingabe und ohne Rückkoppelung zum Server überprüft werden.

• Dynamik und Animation: Lauftexte, automatische Farbänderungen und Reaktionen auf Usereingaben sind ebenso möglich wie Diashows, animierte Buttons, dynamische Menüs oder interaktive Textausgabe.

• Anwendungen: Mit JS können selbst Anwendungen wie Taschenrechner, Spiele oder einfache Datenbanken programmiert werden.

Grundlagen
Im Gegensatz zu Java-Applets, die via HTML aufgerufen und mit Parametern versorgt, aber als Bytecode vom Server geladen werden, lässt sich der JavaScript-Code direkt in die HTML-Seite schreiben. Er wird durch den <SCRIPT>-Tag vom gewöhnlichen Code getrennt und für den JS-fähigen Browser interpretierbar. Vor Browsern, die JS nicht verstehen, kann man den Code mit einem gewöhnlichen HTML-Kommentar (<!–-Kommentar –->) verstecken. Innerhalb des Scripts werden zur Kennzeichnung von Anmerkungen zwei Slashes (//) für einzeilige und /* für mehrzeilige Kommentare verwendet. Sparen Sie nie mit Kommentaren, sie vereinfachen nicht nur anderen das Verständnis Ihres Scripts, sondern helfen auch Ihnen selbst bei späteren Änderungen.

Wo Sie Ihr Script im Dokument plazieren, spielt eigentlich keine Rolle. Der sicherste Platz ist jedoch innerhalb des <HEAD>-Tags. Dadurch wird das Script zuerst in den Browser-Speicher geladen. Wenn der Code irgendwo anders eingefügt ist, besteht immer die Gefahr, dass ein User auf einen Link oder ein Bild klickt, bevor das ganze Script geladen ist, was zu Fehlern führen könnte.

<HTML>
<HEAD>
<TITLE>Beispiel</TITLE>

<SCRIPT LANGUAGE="JavaScript">
<!-- Das Script vor alten Browsern verstecken
Hier kommt der JavaScript-Code hin
// Ende des Versteckspiels -->
</SCRIPT>
</HEAD>

<BODY>
Hier kommt der HTML-Code hin
</BODY>
</HTML>

Der <SCRIPT>-Tag besitzt die zwei Attribute LANGUAGE und SRC. Ersteres präzisiert die Script-Sprache und lässt damit Raum für Alternativen wie VBScript oder verschiedene Sprachversionen. Mit SRC erhält man die Möglichkeit, ein auf mehreren Seiten gebrauchtes Script in einer externen Datei zu speichern und bei Bedarf zu laden. Allerdings wird dieses Attribut bisher nur von Navigator 3.x oder höher unterstützt, der Internet Explorer versteht die Anweisung (noch) nicht.

Beachten Sie ferner, dass am Anfang der Zeile zum Schliessen des HTML-Kommentars auch die JS-Anmerkungszeichen erforderlich sind. Damit wird verhindert, dass der Browser diese Zeile als JS interpretiert und beim Durcharbeiten Fehlermeldungen produziert.

<SCRIPT LANGUAGE="JavaScript1.1" SRC="extern.js">
</SCRIPT>

Nächste Seite | Tips

 

© 1997 Marc von Ah, Windows Guide Schweiz