JavaScript und HTML
JavaScript ist kein Bestandteil von HTML, sondern eine eigene Programmiersprache. Diese Sprache wurde jedoch eigens zu dem Zweck geschaffen, HTML-Autoren ein Werkzeug in die Hand zu geben, mit dessen Hilfe sich WWW-Seiten optimieren lassen.
JavaScript-Programme werden wahlweise direkt in der HTML-Datei oder in separaten Dateien notiert. Sie werden nicht - wie etwa Java-Programme - compiliert, sondern als Quelltext zur Laufzeit interpretiert, also ähnlich wie Batchdateien bzw. Shellscripts. Dazu besitzen moderne WWW-Browser wie Netscape oder Microsoft Internet Explorer entsprechende Interpreter-Software.
In einer Programmiersprache wie JavaScript gibt es für Anfänger viele verwirrende Elemente: Sonderzeichen, Variablen, Wenn-Dann-Anweisungen, Schleifen, Funktionen, Methoden, Parameter, Objekte, Eigenschaften und anderes mehr. Um mit diesen Elementen richtig umgehen zu können, müssen Sie lernen sich vorzustellen, was im Computer passiert, wenn der Programmcode ausgeführt wird. Das ist ein langwieriger Lernprozeß, den Anfänger nur durch viel Übung bewältigen. JavaScript ist dazu allerdings hervorragend geeignet, weil es eine vergleichsweise einfache Sprache ist, bei der viele Aufgabenbereiche einer "großen" Programmiersprache fehlen, z.B. Dinge wie Arbeitsspeicherverwaltung oder Dateioperationen. Außerdem setzt JavaScript auf einer bestimmten Umgebung auf, nämlich auf einer anzuzeigenden oder angezeigten WWW-Seite.
Bevor Sie daran gehen, neuen, eigenen JavaScript-Code zu programmieren, müssen Sie sich exakt darüber im klaren sein, welches Problem Sie damit lösen wollen. Dazu müssen Sie erst einmal wissen, was man mit HTML selbst alles machen kann, und wo die Grenzen von HTML liegen. Von JavaScript müssen Sie dann so viel wissen, daß Sie entscheiden können, ob das Problem mit JavaScript überhaupt lösbar ist. Mit JavaScript können Sie z.B. nicht die typischen Aufgaben von 
CGI-Scripts lösen!
Ferner sollten Sie sich im WWW umsehen, ob es nicht schon frei verfügbare JavaScript-Beispiele gibt, die genau Ihr Problem lösen. Denn es ist immer besser, auf Code zurückzugreifen, der sich in der Praxis bereits bewährt hat, als neuen Code zu erstellen, dessen "heimliche Tücken" einem noch nicht bekannt sind. In vielen Fällen genügt es, vorhandene JavaScripts den eigenen Erfordernissen anzupassen. Eine gute Einstiegsadresse für die Suche nach JavaScripts ist das WWW-Angebot 
Kakao und Kekse 
von Johannes Gamperl. Bei vorhandenen JavaScripts müssen Sie allerdings so viel von der Sprache verstehen, daß Sie genau wissen, welche Variablen oder festen Werte Sie verändern oder welche Funktion Sie ergänzen wollen.
Beachten Sie:
Stellen Sie keine WWW-Seiten mit ungeprüftem JavaScript-Code ins WWW. Für einen Anwender ist es sehr ärgerlich, wenn er Fehlermeldungen des JavaScript-Interpreters am Bildschirm erhält und in schlimmeren Fällen einen Programmabsturz des WWW-Browsers oder gar einen Systemabsturz hat, was bei Online-Sitzungen besonders unangenehm ist.
Wenn Sie JavaScript für wichtige WWW-Seiten verwenden wollen, sollten Sie auf jeden Fall mehrere Browser zum Testen einsetzen. Denn leider sind die JavaScript-Interpreter der beiden JavaScript-fähigen WWW-Browser Netscape und MS Internet Explorer noch immer sehr intolerant, unintelligent und unterschiedlich in ihrer Leistung. Generell gilt: Netscape 2.0 interpretiert den seinerzeit eingeführten JavaScript-Sprachstandard 1.0. Der MS Internet Explorer versteht diesen Sprachstandard weitgehend seit der Version 3.0. Netscape interpretiert seit Version 3.0 den erweiterten JavaScript-Standard 1.1. Dazu gehört vor allem das neu hinzugekommene Grafik-Objekt . Ab Version 4.0 versteht Netscape auch das Layer-Objekt. Weiterhin unterscheiden sich Netscape und der MS Internet Explorer in der Interpretation einzelner Objekteigenschaften. So ist etwa das Format für Cookies (siehe Anwendungsbeispiel für Cookies) bei beiden Browsern unterschiedlich. Auch bei der internen Verarbeitung von vielfach zu durchlaufenden Schleifen gibt es Unterschiede.
JavaScript-Bereiche in HTML definieren
Für JavaScript-Programmabschnitte können Sie in HTML Bereiche definieren.
Beispiel:
<script language="JavaScript">
<!--
alert("Hallo Welt!");
//-->
</script>
|
Erläuterung:
Mit <script language="JavaScript"> leiten Sie einen Bereich für JavaScript innerhalb einer HTML-Datei ein (script = Quelltext, language = Sprache). Dahinter - am besten in der nächsten Zeile - sollten Sie mit <!-- einen Kommentar einleiten. Dadurch verhindern Sie, daß ältere WWW-Browser, die JavaScript nicht kennen, den folgenden JavaScript-Code ignorieren und nicht irrtümlich als Text innerhalb der HTML-Datei interpretieren.
Im obigen Beispiel wird mit Hilfe von JavaScript ein Meldungsfenster mit dem Text "Hallo Welt!" am Bildschirm ausgegeben.
Am Ende eines JavaScript-Bereichs schließen Sie mit //--> den Kommentar und mit </script> den Bereich für den Programmcode.
Beachten Sie:
Es gibt keine festen Vorschriften dafür, an welcher Stelle einer HTML-Datei ein JavaScript-Bereich definiert werden muß. Es ist unter JavaScript-Programmierern zur Gewohnheit geworden, einen solchen Bereich im Kopf der HTML-Datei, also zwischen <head> und </head> zu definieren. Dadurch ist am ehesten sichergestellt, daß der Code vom WWW-Browser bereits eingelesen ist und zur Verfügung steht, wenn er ausgeführt werden soll.
JavaScript-Code kann automatisch beim Einlesen der HTML-Datei ausgeführt werden. Das ist dann der Fall, wenn JavaScript-Befehle in einem JavaScript-Bereich außerhalb jeder selbst definierten Funktion stehen, so wie im obigen Beispiel. Wenn Sie eigene Funktionen definieren, können Sie diese kontrolliert an bestimmten Stellen aufrufen, wie im folgenden beschrieben.
JavaScript-Elemente in HTML-Tags
JavaScript kann auch innerhalb herkömmlicher HTML-Tags vorkommen. Das ist dann kein komplexer Programmcode, sondern in der Regel nur der Aufruf bestimmter Methoden, Funktionen, Objekte, Eigenschaften. Für den Aufruf gibt es sogenannte Event-Handler. Das sind JavaScript-eigene Zusatzangaben in HTML-Tags. Für jeden der möglichen Event-Handler ist festgelegt, in welchen HTML-Tags er vorkommen darf.
Beispiel:
<html>
<head>
<title>JavaScript-Test</title>
<script language="JavaScript">
<!--
function Quadrat(Zahl)
{
Ergebnis = Zahl * Zahl;
alert("Das Quadrat von " + Zahl + " = " + Ergebnis);
}
//-->
</script>
</head>
<body>
<form>
<input type=button value="Quadrat von 6 errechnen" onClick="Quadrat(6)">
</form>
</body>
</html>
|
Erläuterung:
Das obige Beispiel zeigt eine komplette HTML-Datei. Im Dateikopf ist ein 
JavaScript-Bereich definiert. Innerhalb dieses Bereichs steht eine selbst definierte Funktion, die Funktion mit dem Namen Quadrat(x). Die Funktion bekommt beim Aufruf eine Zahl x übergeben. Sie errechnet das Quadrat dieser Zahl und gibt das Ergebnis in einem Meldungsfenster aus. Dieser JavaScript-Code wird aber nur ausgeführt, wenn die Funktion explizit aufgerufen wird. Im obigen Beispiel erfolgt der Aufruf mit Hilfe eines frei definierten Formularbuttons. Wenn der Anwender auf den Button klickt, wird die Funktion ausgeführt.
Beachten Sie:
Bei den Event-Handlern wird beschrieben, was solche Angaben wie onClick= (wie im obigen Beispiel) bedeuten, und in welchen HTML-Tags sie vorkommen dürfen.
JavaScripts in separaten Dateien
Netscape interpretiert seit der Version 3.0 auch JavaScript-Code, der in separaten Dateien notiert ist. Das ist sehr nützlich, wenn Sie gleiche JavaScript-Funktionen in mehreren HTML-Dateien verwenden wollen. Denn so brauchen Sie den Code nur einmal notieren und können ihn in mehreren HTML-Dateien referenzieren.
Beispiel (HTML-Datei):
<html>
<head>
<title>JavaScript-Test</title>
<script language="JavaScript" src="quadrat.js">
</script>
</head>
<body>
<form>
<input type=button value="Quadrat von 6 errechnen" onClick="Quadrat(6)">
</form>
</body>
</html>
|
Beispiel (separate JavaScript-Datei):
function Quadrat(Zahl)
{
Ergebnis = Zahl * Zahl;
alert("Das Quadrat von " + Zahl + " = " + Ergebnis);
}
|
Erläuterung:
Das Beispiel tut das gleiche wie das Beispiel im Abschnitt zuvor. Der Unterschied ist lediglich, daß der JavaScript-Code in einer separaten Datei steht. Dazu notieren Sie im einleitenden <script>-Tag die Angabe src= (src = source = Quelle). Dahinter folgt, in Anführungszeichen, der Name der separaten Datei mit dem Quellcode.
Die Datei mit dem Quellcode muß eine reine ASCII-Datei sein und sollte die Dateinamenerweiterung .js erhalten. Die Datei sollte nichts anderes als JavaScript-Code enthalten.
Beim Referenzieren von separaten JavaScript-Dateien, die sich in anderen Verzeichnissen oder auf anderen Server-Rechnern im Internet befinden, gelten die gleichen Regeln wie beim Einbinden von Grafiken.
.
© 1997 
Stefan Münz, s.muenz@euromail.com
JavaScript und HTML
