JavaScript

JavaScript gehört, wie der Name schon sagt, zu den Skriptsprachen und ist relativ einfach zu erlernen. Sie wurde extra für HTML entwickelt und erweitert diese. Der Code von JavaScript wird innerhalb eines HTML Codes über den <script>-Tag integriert und wird zusammen mit HTML über HTTP vom Web-Server im Web-Browser geladen. Wie bereits erwähnt, werden Skriptsprachen interpretiert, so auch JavaScript im Web-Browser. Außerdem ist sie die Basis für dynamisches HTML und das Web 2.0. Dynamisches HTML oder auch DOM-Scripting bezeichnen bestimmte Webdesign-Methoden, bei denen während der Anzeige einer Webseite diese selbst, ausgelöst durch Benutzereingaben, verändert wird.

Der Begriff „dynamisch“ bezieht sich dabei auf die Idee, dass diese Änderungen von Ereignissen bedingt werden, die auch mehrfach beim Anzeigen einer Seite auftreten können.

Beispiele für dynamische Anzeigeeffekte sind:

das Erscheinen („Aufklappen“) eines Menüs
die Hervorhebung eines Textes
die Möglichkeit, Objekte durch Drag and Drop auf dem Bildschirm zu verschieben
Formularfelder automatisch in Abhängigkeit von anderen Feldern zu belegen
Webseiten, die sich wie clientseitige Anwendungsprogramme bedienen lassen

Weiteres zu DOM wird in einem separaten Kapitel behandelt.

Im Folgenden werde ich zur Demonstration ein kleines JavaScript-Programm schreiben und von dem Resultat einen Screenshot hineinstellen. HTML widme ich ein extra Kapitel, deshalb werde ich darauf hier nicht eingehen (auch, wenn es sich um eine HTML-Datei handelt).

Das ist der Code, den ich verwendet habe:

Der Code zwischen den script-Tags ist JavaScript. <script…> ist das Tag, das den Beginn des Script-Codes kennzeichnet und </script> kennzeichnet das Ende von diesem.

und so sah das Ganze dann in meiner Entwicklungsumgebung (Atom) aus:

durch alert () wird etwas auf dem Bildschirm ausgegeben

und so sieht das ganze dann in Chrome aus:

In diesem Beispiel wird der JavaScript-Code beim Laden des HTML-Codes sofort ausgeführt. Häufig soll JavaScript jedoch erst als Reaktion auf eine Benutzereingabe ausgeführt werden. Zum Beispiel, dass wenn ein Benutzer auf eine Schaltfläche klickt, sich als Reaktion ein Hinweisfenster öffnet.

Hier ein Code Beispiel und das Resultat:

Die Tags <form> und <input> erzeugen die Schaltfläche.
<input> enthält die Eigenschaft onclick, welche einen Event-Handler definiert, mit dem man festlegt, was geschieht, wenn ein Benutzer auf die Schaltfläche klickt.

Das Resultat sieht wie folgend aus:

und nachdem man auf die Schaltfläche geklickt hat:

Kommentare

Kommentare sind Anmerkungen des Programmierers im Quellcode, die vom Computer ignoriert werden. Diese sollen dabei helfen, die Lesbarkeit des Codes zu erhöhen, damit man selbst auch nach einigen Monaten noch weiß, was man da genau gemacht hat, oder damit auch andere den Code lesen können und wissen, was man sich dabei gedacht hat. es gibt folgende Arten von Kommentaren:

alert („Hallo“); // diese zwei Querstriche kennzeichnen einen einzeiligen Kommentar

/*………………..*/ kennzeichnet einen mehrzeiligen Kommentar

Darstellung mit einem nicht JavaScript-fähigen Browser

Nicht jeder verwendet einen Browser, der auch JavaScript versteht. Aus diesem Grund gibt es einen <noscript> -Tag, das vom Browser nur beachtet wird, wenn kein JavaScript ausgeführt werden kann. Hierin lässt sich z.B. ein Hinweis einbauen, dass für die Betrachtung der Seite JavaScript herausgesetzt wird.

Der Code könnte dann wie folgt aussehen:

Falls der Browser dann kein JavaScrip versteht, gibt die Seite den folgenden Satz aus: Diese Seite benötigt JavaScript.

Teilen mit: