JavaScript einschalten
Um JavaScript im Browser verwenden zu können, muss es im Browser aktiviert sein. Das ist es in der Regel. Manchmal wird JavaScript aus Sicherheitsgründen deaktiviert, um sich vor fremden böswilligen Scripts zu schützen. Die Sprache lässt zwar per Definition keinen Zugriff auf die Festplatte oder das Betriebssystem zu, es werden jedoch immer wieder Sicherheitslücken bekannt, die den in den Browsern inplementierten Interpreter betreffen.
JavaScript Einbinden in HTML
Allgemein:
JavaScripts werden mit dem Tag <SCRIPT type="text/javascript"> in das HTML-Dokument eingefügt und werden mit </SCRIPT> geschlossen. Innerhalb dieser Klammer steht dann Ihr Sourcecode.
Ist der Browser in der Lage auch andere Scriptsprachen zu interpretieren können Sie damit auch andere Scripts einbinden. Zum Beispiel Visual Basic: <SCRIPT language="VBScript">.
Um zu vermeiden, das Browser, die nicht JavaScript fähig sind, die Scriptanweisungen als Text auffassen, werden die Programmzeilen zusätzlich in HTML-Kommentare (<!-- ... -->) gefasst. Dabei gibt es das Problem, dass das Ende des HTML-Kommentars (-->) wiederum als JavaScript interpretiert wird. Daher muß das Kommentarende als JavaScript Kommentarzeile (mit //) begonnen werden.
Es gibt die Möglichkeit auf Browsern, die nicht JavaScript-fähig sind, oder die JavaScript abgeschaltet haben, einen alternativen Text ausgeben zu lassen. Dies geschieht innerhalb der Klammer <NOSCRIPT> ... </NOSCRIPT> der ähnlich funktioniert wie <NOFRAMES> in HTML. Denken Sie immer auch an die, die JavaScript aus Sicherheitsgründen abgeschaltet haben, oder die JavaScript nur eingeschränkt unterstützen.
Damit ergibt sich folgednes Grundgerüst:
<SCRIPT type="text/javascript">
<!--
Anweisungen
//-->
</SCRIPT>
<NOSCRIPT>
alternativer Text
</NOSCRIPT>
Überlegen Sie einmal was bei den verschiedenen Szenarien ausgegeben wird:
- Der Browser kennt kein JavaScript.
- Der Browser kennt JavaScript und hat es eingeschaltet.
- Der Browser kennt JavaScript aber hat es nicht eingeschaltet.
Position der Scripte:
Die Scripte können an verschiedenen Stellen des HTML-Dokuments stehen und werden dort interpretiert wo sie implementiert sind.
- Im HEAD
Es ist unter JavaScript-Programmierern zur Gewohnheit geworden, einen JavaScript Bereich im Kopf der HTML-Datei, also zwischen <head> und </head> zu definieren. Dadurch ist sichergestellt, dass 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 Beispiel 2.
- Im BODY
In manchen Fällen ist es erforderlich, den Script-Bereich innerhalb des HTML-Dateikörpers, also innerhalb von <body>...</body>, zu notieren. Zum Beispiel, wenn Sie am Ende der Datei mit JavaScript dynamisch Datum und Uhrzeit der letzten Änderung an der Datei schreiben wollen. Beispiel 3
- extern
Scripte können auch extern eingebunden werden:
<SCRIPT type="text/javascript" src="myScript.js"> </SCRIPT>
Die <SCRIPT>-Klammer bleibt dann leer. Die Datei, in der sich das Script befindet, wird mit dem Parameter SRC referenziert. Dies ist wieder eine reine ASCII-Textdatei ohne HTML-Elemente! Das wird auch am MIME-Type sichtbar, der zusätzlich angegeben wird: type="text/javascript".
Als Dateiendung hat sich ".js" durchgesetzt. Unterverzeichnise referenzieren Sie genauso wie bei einem Link mit einem Slash (/). src="verzeichnis/myScript.js"
Der große Vorteil ist hier, dass Sie Scripte für viele Seiten die diese benutzen, nur einmal schreiben brauchen und sich so eine Script-Bibliothek aufbauen können.
Wenn Sie sowohl den src-Parameter setzen, also eine externe Datei einbinden und zusätzlich etwas in die SCRIPT-Klammer schreiben wird letzteres ignoriert. In diesem Fall müssten Sie zwei SCRIPT-Klammern setzen:
<SCRIPT type="text/javascript" src="myScript.js"></SCRIPT>
<SCRIPT type="text/javascript">
Anweisungen...
</SCRIPT>
Grundlegendes
Programme werden immer von oben nach unten abgearbeitet. Der Interpreter führt Zeile für Zeile aus. In jeder Zeile steht eine Anweisung, die mit einem Smikolon abgeschlossen werden muß.
Einrückungen und Zeilenumbrüche haben, wie in HTML, keine Auswirkungen auf die Funktionsweise des Scripts. Dennoch sollte man sich unbedingt darum bemühen den Quellcode auch optisch zu gliedern, da er sonst sehr schnell unübersichtlich werden kann. Eine gute Gliederung vereinfacht die Fehlersuche erheblich.
Kommentare
Um den Sourcecode auch noch nach einiger Zeit nachvollziehen zu können, sollten Sie an geeigneten Stellen Kommentare unterbringen. Kommentare sind Zeilen im Programmcode, die vom Interpreter ignoriert werden. Es gibt zwei Typen:
- Einzeilige Kommentare werden mit einem Doppelslash // begonnen und enden beim nächsten Zeilenumbruch.
- Mehrzeilige Kommentare beginnen mit /* und enden mit */. Der Text dazwischen kann dann beliebig lang sein und über mehrere Zeilen gehen.
Beispiel:
<SCRIPT type="text/javascript">
<!--
// zuerst wird ein Wert berechnet:
var x = 5*3;
/* ... und dann wird er ausgegeben.
Dazu benutze ich eine alert-Box.
Der Nachteil ist, daß der Nutzer diese immer wegklicken muß.
*/
alert(x);
//-->
</SCRIPT>
Aufrufen von JavaScript
Neben der Frage wo das JavaScript implementiert wird, ist die Frage wie das Script aufgerufen wird von Bedeutung. Auch hier gibt es verschiedene Möglichkeiten.
- automatisches Aufrufen über HTML
JavaScripts können auch automatisch von einem HTML-Tag aufgerufen werden, wie das Erzeugen einer alertbox beim Start des headers in Beispiel 2.
- Reaktion auf Benutzeraktion
Ein JavaScript kann auch über einen Link aufgerufen werden. Dabei kann man sich das Pseudoprotokoll "javascript:" zu Nutze machen: <A href="javascript:alert('Hallo');> Begrüßung </A>
Der Nachteil ist, daß Browser ohne JavaScript mit diesem Link nichts anfangen können. Stattdessen kann man sich der Event-Handler bedienen (dazu später noch mehr). Event-Hanlder fangen immer mit on an. Um auf einen Mausklick zu reagieren wird der Handler onClick bemüht. Soll lediglich das Script ausgeführt werden und die Seite nicht durch den href wechseln, wird dieser mit einem Doppelkreuz (#) belegt.
<A href="#" onClick="alert('Hallo');"> Begrüßung </A>
Eine weitere Möglichkeit besteht darin ein Script ablaufen zu lassen, wenn sich Zustände von Formularelementen (Radiobuttons, Selectmenüs etc.) ändern.
Siehe auch Beispiel 3.
- automatisches Aufrufen über JavaScript
JavaScripts können sich auch gegenseitig aufrufen. Das ermöglicht eine modulare Entwicklung komplexer Anwendungen.