Client-seitige Webprogrammierung mit Javascript

Javascript ist eine Programmiersprache, die in einem Webbrowser ausgeführt werden kann. Wir können Javascript-Programme ähnlich wie Stylesheets in eine HTML-Datei einbinden: entweder direkt innerhalb von script Tags im Header einer HTML-Datei oder durch Angabe der URL einer Javascript-Datei.

Javascript-Code kann in HTML-Dateien in <script>-Tags eingebunden werden und dabei entweder in die HTML-Datei selbst geschrieben werden oder aus einer Datei mit der Endung .js geladen werden.

<script type="text/javascript" src="dateiname.js"></script>

Die Sprachelemente von Javascript sind die gewöhnlicher imperativer Programmiersprachen. Wir werden einige im Folgenden exemplarisch immer dann einführen, wenn wir sie benötigen.

Die folgende HTML-Datei verwendet Javascript, um dynamisch die URL, unter der sie erreichbar ist, anzuzeigen.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>URL-Anzeige</title>
    </head>
    <body>
        <script type="text/javascript">
            document.write(window.location);
        </script>
    </body>
</html>

Die Methode document.write wird hier verwendet, um die in window.location gespeicherte Zeichenkette in das Dokument einzubauen.

Mit window.location.search kann auf den sogenannten query parameter, also den Teil der URL ab dem Fragezeigen, zugegriffen werden. In Kombination mit der Methode substring, die einen Teilstring ab einer gegebenen Position selektiert, können wir den Teil der URL hinter dem Fragezeichen mit window.location.search.substring(1) abfragen.

Die folgende HTML-Datei wandelt diesen Teil der URL in eine Zahl um und fügt dann in einer Schleife Zahlen von der gegebenen Zahl abwärts zählend bis 1 in das Dokument ein.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Countdown</title>
</head>
<body>
<script type="text/javascript">
var counter = parseInt(window.location.search.substring(1));

while (counter > 0) {
	document.write("<p>" + counter + "</p>");
	counter = counter - 1;
}
</script>
</body>
</html>

Hierzu verwenden wir eine while-Schleife, die in Javascript eine etwas andere Syntax hat als in Python.