JavaScript

Allgemeines

Um nun die im DOM beschriebenen Elemente einer Webseite dynamisch verändern zu können, braucht man noch eine Scriptsprache, in der die Befehle abgefasst sind. Die am weitesten verbreitete und von den meisten Browsern interpretierbare Scriptsprache ist JavaScript.

JavaScript ist nicht Bestandteil von HTML, sondern eine Programmiersprache, die eigens für die Verwendung in HTML-Seiten entwickelt wurde. JavaScript-Programme werden nicht vorher compiliert, sondern als Code dem HTML-Code beigefügt - entweder als eigens gekennzeichneter Abschnitt in einer HTML-Seite oder in einer separaten Datei - und zur Laufzeit auf dem Client interpretiert. Der Webbrowser benötigt zur Ausführung der JavaScript-Abschnitte einen eigenen (integrierten) Interpreter.

Für viele Einsatzbereiche gibt es bereits JavaScript-Code, der im Internet frei verfügbar ist. Es ist durchaus emfpehlenswert, solche Code-Ressourcen zu nützen, da die Scripts meist von erfahrenen JavaScript-Programmierern geschrieben werden. Sie müssen dann nur noch für die eigene Webseite angepasst und ev. ergänzt werden. Um JavaScript-Programmier-Kenntnisse wird also trotzdem niemand herumkommen.

Wer JavaScript für seine WWW-Seiten verwenden will, sollte sie auf jeden Fall mit mehrere Browsern testen. Denn leider sind die JavaScript-Interpreter der am meisten verbreiteten Browser Netscape und MS Internet Explorer noch immer unterschiedlich in ihrer Leistung.

JavaScript-Versionen

JavaScript wurde von Netscape entwickelt und ist auch dort linzenziert. Ein echter Standard konnte daher bislang nicht erreicht werden.

Einen gewissen Anhaltspunkt, welche JavaScript-Befehle von welchem Browser (richtig) interpretiert werden, geben die Versionsangaben der Browser. Daran kann man sich bei der Webseiten-Entwicklung mit JavaScript orientieren. 100%ig verlassen kann man sich jedoch nicht auf die Angaben der Browser-Anbieter. Es ist auf jeden Fall empfehlenswert, HTML-Seiten mit JavaScript-Code auf mehreren Browser-Versionen zu testen.

JavaScript-Version Browser-Version
1.0

MS Internet Explorer 3.0
Netscape 2.0

1.1

MS Internet Explorer 4.0
Netscape 3.0

1.2

MS Internet Explorer 4.0 *)
Netscape 4.0

1.3

MS Internet Explorer 5.0
Netscape 4.06

1.5 Netscape 6.0

*) mit Einschränkungen

JavaScript in einer HTML-Seite

Innerhalb einer HTML-Seite kann JavaScript-Code in einigen HTML-Tags oder in eigenen Script-Bereichen angegeben werden.

JavaScript in HTML-Tags

Für viele Tags können sogenannte Event-Handler formuliert werden. Das sind Anweisungen, die bei bestimmten Benutzeraktionen (z. B. Maus-Klick auf ein Element oder nur Mit-der-Maus-Darüberfahren, Abschicken eines Formulars etc.) ausgeführt werden. Solche Anweisungen bestehen meist nur aus einer einzigen (JavaScript)-Anweisung oder einem Funktionsaufruf.

Ein Beispiel dazu: In der folgenden kurzen HTML-Datei wird beim Laden der Datei (Event-Handler onLoad im <body>-Tag) ein Popup-Fenster geöffnet. Beim Anklicken des Textes (onClick im <p>-Tag) erscheint eine Meldung.

<html>
<head>
<title>JavaScript in HTML-Tags</title>
</head>
<body onLoad="window.open('popup.htm','Popup','height=100,width=300');">
<p onClick="alert('Hello World!');">Hier kommt meine Message - klich mich!</p>
</body>
</html>

Die Datei kann hier getestet werden.

Welche Event-Handler in welchen Tags erlaubt sind, kann in der Dokumentation von HTML 4.0 nachgelesen werden.

JavaScript in eigenen Bereichen

Sind in Event-Handlern komplexere Anweisungen nötig, so werden diese als Funktionen in JavaScript formuliert. Der Event-Handler ruft dann die Funktion auf. Die Definition der Funktion(en) steht in der HTML-Datei in einem eigenen (JavaScript)-Bereich, gekennzeichnet durch einen <script>-Tag. Es gibt keine Vorschriften, wo ein solcher Script-Tag stehen soll, es hat sich jedoch bewährt, ihn in den <head>-Bereich zu stellen. Ein Script-Bereich kann aber auch Anweisungen außerhalb von Funktionsdefinitionen beinhalten, diese werden dann auf jeden Fall ausgeführt:

<html>
<head>
<title>JavaScript in Script-Bereich</title>
<script type="text/javascript">
alert("Hier wird JavaScript ausgeführt");
</script>
</head>
<body>
Dokument-Inhalt...
</body>
</html>

Testen Sie das Dokument hier.

Der Mime-Type für JavaScipt (text/javascript) muss (seit der Version HTML 4.0) angegeben werden.

JavaScript in einer eigenen Datei

JavaScript-Code kann aber auch in einer eigenen Datei (Endung .js) abgespeichert werden, die dann von der HTML-Seite referenziert wird. Dies empfiehlt sich insbesondere dann, wenn JavaScript-Code mehrfach, also in mehreren HTML-Seiten, verwendet werden soll. In der HTML-Seite wird die Verbindung in Form eines <script>-Tags im <head>-Bereich hergestellt:

<html>
<head>
<title>JavaScript in eigener Datei</title>
<script type="text/javascript" src="alert.js"></script>
</head>
<body onLoad="show_alert()">
Dokument-Inhalt...
</body>
</html>

Die beigefügte Datei "alert.js" muss dann den JavaScript-Code beinhalten, also folgenden Inhalt haben:

show_alert()
{
alert("Hier wird JavaScript ausgeführt");
}

 

Module, die für die Durchführung vorausgesetzt werden

Ergänzende und vertiefende Module