Websiteentwicklung: JavaScript: Einleitung

<< Titel | Inhaltsverzeichnis | Index | Tutorial >>

Wikipedia hat einen Artikel zum Thema:

JavaScript

Was ist JavaScript?

JavaScript ist eine Skriptsprache, die meist auf dem Rechner des Benutzers ausgeführt wird. Im Gegensatz dazu ist beispielsweise PHP eine Skriptsprache, die meist auf einem Dienstrechner ausgeführt wird, welcher das Ergebnis dann etwa über ein Protokoll wie HTTP an das Darstellungsprogramm des Nutzers ausliefert. Wird solch ein PHP-Skript auf einem Dienstrechner ausgeführt, ist dessen Ausgabe also unabhängig von den Möglichkeiten des Darstellungsprogrammes des Benutzers gegeben.

Ein systembedingtes Problem von JavaScript liegt darin, dass die verschiedenen Darstellungsprogramme unterschiedliche Versionen oder Interpretationen der Sprache unterstützen oder aber die Interpretation solcher Skripte auch pauschal oder seitenspezifisch deaktiviert sein kann. Ein Autor muss diesen Sachverhalt bei der Erstellung eines Dokumentes also berücksichtigen und kann nicht davon ausgehen, dass sein Skript bei jedem Benutzer wie gewünscht oder geplant ausgeführt wird.

Ende 1995 wurde JavaScript von Netscape mit dem Netscape Navigator 2.0 veröffentlicht, der JavaScript 1.0 unterstützt. Microsoft erfand für sein Programm Internet Explorer eine eigene Variante namens „JScript“. In der Spezifikation ECMA-262 wurden JavaScript/JScript später als ECMAScript zu einem Industriestandard erklärt. JavaScript wird von Mozilla weiterhin optimiert und erweitert. Die 2008 aktuelle JavaScript-Version ist die Version 1.8, das Programm Firefox von Mozilla interpretiert aber bereits ab Version 3.1 JavaScript 1.9. Neuerungen bei Mozillas JavaScript werden jedoch nicht automatisch zum Standard und sollten nur verwendet werden, wenn man sich sicher ist, dass der Benutzer ein Darstellungsprogramm von Mozilla verwendet.

Der Standard ECMAScript selbst umfasst primär den eigentlichen Sprachkern. Mit diesem können zwar etwa Rechnungen und Manipulationen von Zeichenketten durchgeführt werden, er eignet sich aber nicht, um auf Dokumente zuzugreifen, sie auszulesen und eventuell zu manipulieren. Für solche Zugriffe auf das Dokument selbst hat das W3C das sogenannte Dokument-Objekt-Modell (kurz: DOM) definiert. Dieses besteht aus einem Kernmodul und einigen Erweiterungen, etwa zur Ereignisbehandlung, eine für Stilvorlagen, eine speziell für (X)HTML. Ferner gibt es bei verschiedenen Sprachen weitere, für diese spezifische Erweiterungen des DOMs, etwa für SVG.

Jenseits von diesen standardisierten Bestandteilen dieser Sprachfamilie gibt es, auch bedingt durch die Historie, zahlreiche Altlasten und proprietären Wildwuchs. Damals wie heute gibt es eigenmächtige Einzelgänge verschiedener Anbieter von Darstellungsprogrammen, die teilweise gar nicht in einem Standard-Modul aufgenommen wurden oder erst viele Jahre später, gegebenenfalls aber etwas anders als ursprünglich vom jeweiligen Anbieter geplant.

Dies alles macht es etwas schwierig, genau zu umreißen, was JavaScript eigentlich ist - der ECMAScript-Sprachkern zusammen mit dem DOM, ergänzt durch Erweiterungen für spezielle Formate wie (X)HTML oder SVG, oder der ganze Mischmasch aus verschiedenen Quellen, der mehr oder weniger bei diesem oder jenem Darstellungsprogramm funktioniert? Die Meinungen darüber gehen auseinander, was diese Sprache auch gar nicht so einfach fassbar macht.

Wofür und wie verwendet man JavaScript?

JavaScript dient zwar nicht ausschließlich, aber hauptsächlich dazu, (X)HTML oder SVG dekorativ zu ergänzen, um einen alternativen interaktiveren Zugang zum Inhalt eines Dokumentes anzubieten. Auch dient es der Erstellung von Benutzeroberflächen mit Hilfe von Mozillas XUL (XML User Interface Language).

Aus den vorherigen Ausführungen ergibt sich bereits die Funktion von JavaScript für insbesondere die Formate (X)HTML oder SVG. Das generelle Konzept, wie (X)HTML oder SVG zusammen mit ergänzenden Sprachen wie CSS und JavaScript verwendet werden kann, ist im Buch Barrierefreiheit und Benutzbarkeit erläutert. Ähnlich wie CSS dient es eigentlich der Dekoration und ändert nicht den Inhalt eines Dokumentes, welcher immer mit (X)HTML oder SVG verfügbar gemacht wird.

Mittels CSS können dann optional in einem weiteren Schritt vom Autor alternative Präsentationen des Inhaltes angeboten werden, alternativ zu der primären Präsentation des Inhaltes ohne Anwendung von CSS.

JavaScript kann dann optional in einem dritten Schritt hinzukommen, um weitere Alternativen anzubieten, die zumeist einen dynamischeren, interaktiveren Zugang zum Inhalt ermöglichen.

Kernaussage dieses Schichtenmodelles ist, dass der Inhalt immer zugänglich ist, welcher somit allein mit (X)HTML oder SVG zu realisieren ist, etwa auch als Ausgabe eines Dienstprogrammes wie PHP auf einem Dienstrechner. Mittels CSS und JavaScript können dann zusätzliche, davon unabhängige alternative Präsentationen desselben Inhaltes bereitgestellt werden. CSS und JavaScript werden also in diesem Modell nie dazu genutzt, um relevante Inhalte zu ändern oder etwa erst verfügbar zu machen. Dies gewährleistet die allgemeine Zugänglichkeit des eigentlichen Inhaltes unabhängig davon, ob die Interpretation von CSS oder JavaScript überhaupt beim Benutzer aktiviert sind.

Indessen gilt dieser Ansatz nur für veröffentlichte Dokumente, wo der Autor also keine Kontrolle darüber hat, ob oder wie insbesondere JavaScript interpretiert wird. Hingegen bei unveröffentlichten Dokumenten auf dem eigenen Rechner sind Autor und Nutzer dieselbe Person, somit ist die Kontrolle vorhanden und das Schichtenmodell ist nicht relevant. Bei dieser Art von Verwendung kann mit JavaScript auch recht bedenkenlos der Inhalt von Dokumenten verändert werden. Die meisten einfachen Lernbeispiele dieses Buches zielen auf diese zweite, private Art der Nutzung von interaktiven Dokumenten ab, nicht auf zu veröffentlichende Dokumente, die immer allgemein zugänglich und barrierefrei gestaltet sein sollten. Sollen Dokumente veröffentlicht werden, ist es hingegen von zentraler Bedeutung, den Inhalt zugänglich und barrierefrei anzubieten, sich also etwa strikt an das Schichtenmodell zu halten. Dies wiederum kann die Anwendungsmöglichkeiten von JavaScript stark einschränken, beziehungsweise kann es erforderlich machen, für den primären Inhalt auf andere Skriptsprachen wie PHP auszuweichen, die auf dem Dienstrechner ausgeführt werden und nicht erst eventuell auf dem Rechner des Benutzers.

In der Praxis findet man auch leider oft veröffentlichte Dokumente, die JavaScript in einer Form enthalten, die die Inhalte unzugänglich oder nicht barrierefrei machen oder anders interpretiert: Solche Projekte haben eigentlich gar keinen relevanten Inhalt, lediglich wenn der Benutzer die Interpretation von JavaScript aktiviert, besteht die Gefahr, dass dieser der Illusion unterliegt, es wäre Inhalt vorhanden, weil dieser scheinbar erst durch die Verwendung von JavaScript interaktiv verfügbar wird. Derartige Projekte zeigen somit lediglich, dass die Autoren solcher Projekte nicht verstanden haben, wie zugängliche und barrierefreie Projekte umzusetzen sind und können nicht als Vorbild für verantwortungsbewusste Autoren dienen, die relevanten Inhalt veröffentlichen möchten.

Dieses praktische Problem von JavaScript liegt darin begründet, dass es damit eben sehr leicht möglich ist, Strukturen und Inhalte von Dokumenten unabhängig von ihrer Bedeutung oder ihrem Informationsgehalt zu manipulieren. Auf Grund der Mächtigkeit einer Programmiersprache kann diese kaum so formuliert werden, dass ein Missbrauch oder eine mangelhafte Nutzung automatisch ausgeschlossen werden könnten. Daher kommt den Autoren von zu veröffentlichenden Dokumenten die besondere Verantwortung zu, zu gewährleisten, dass der eigentliche Inhalt barrierefrei und zugänglich ist, insbesondere unabhängig davon, ob die Interpretation von JavaScript bei einem Benutzer aktiviert oder verfügbar ist oder nicht.

Was haben JavaScript und Java miteinander zu tun?

Kurzfassung: Nichts!

Langfassung: JavaScript hieß ursprünglich LiveScript, wurde aber in JavaScript umbenannt, als die Firma Netscape einen Kooperationsvertrag mit der Firma Sun, von der Java ursprünglich kommt, abschloss: Java und JavaScript sollten sich gegenseitig Marktgeltung verschaffen.

Auf Grund dieser Kooperation soll Netscape die Syntax von JavaScript der von Java in Details angeglichen haben. Grundsätzlich ähneln beide Sprachen einander syntaktisch sowieso, weil beide Sprachen der Schreibweise der Programmiersprachen C bzw. C++ folgen. Das ist aber praktisch schon das einzige, worin JavaScript und Java einander ähneln, es gibt viele Unterschiede.

Vorteile von JavaScript

JavaScript ist als Einstieg in die Programmierung gut geeignet:

Der Umfang der Syntax ist überschaubar.
Um in JavaScript Skripte zu erstellen, zu testen oder auszuführen, werden nur ein Darstellungsprogramm mit aktivierter Interpretation von JavaScript und ein Texteditor benötigt. Aufwendiges Herunterladen von Programmen und für Programmieranfänger schwierige Installationen oder Konfigurationen sind also nicht erforderlich, um JavaScript zu lernen und zu verwenden.

Nachteile von JavaScript

JavaScript wurde in sehr kurzer Zeit entworfen und enthält daher leider auch einige Designfehler, die leider nachträglich auch zum Standard erklärt wurden und damit konserviert werden. JavaScript ist keine besonders "strenge" Sprache und bietet viele und damit auch viele schlechte Programmierpraktiken. Gute Praktiken wie 'Closures' setzen bereits erweiterte Programmierkenntnisse voraus. Dadurch, dass JavaScript nicht von einer einzelnen Firma, sondern von den Herstellern von Darstellungsprogrammen und daran anknüpfenden Konsortien weiterentwickelt wird, ist der Entwicklungsfortschritt träge.

Anders als etwa bei vom W3C entwickelten Formaten wie (X)HTML, SVG, CSS gibt es keine übersichtlichen Empfehlungen zu JavaScript, die genannte Spezifikation ECMA-262 ist eher eine Abstraktion einer kompletten Skript-Sprachfamilie, was etwa der Beziehung von HTML zu SGML als allgemeinem Sprachkonstrukt entspricht.

Das W3C definiert nur für die eigenen Sprachen wie (X)HTML oder SVG das bereits genannte DOM, über welches JavaScript dann Zugriff auf den Inhalt eines Dokumentes bekommt, es definiert aber nicht JavaScript selbst.

Mit welchen Programmen soll man Skripte erstellen?

WYSIWYG-Editoren oder Office-Programme?

(WYSIWYG = 'What you see is what you get.' 'Was du siehst, ist was du bekommst.' Scherzhaft öfter auch frei übersetzt als: Du bekommst, was du verdienst.)

Besonders ungeeignet für den ersten Kontakt mit JavaScript sind komplexe Editoren auf WYSIWYG-Basis (wie Dreamweaver, Netobject-Fusion, Frontpage, GoLive oder ähnliche) oder (Open- oder Microsoft-)Office-Programme. Auf den eigentlichen (X)HTML- und JavaScript-Quelltext zugreifen kann man mit solchen visuellen Editoren oft nur indirekt oder umständlich, zumindest jedenfalls verführen sie den Anwender dazu, sich den Quelltext gar nicht oder kaum anzuschauen. Sieht man sich den Quelltext nie an, dann kann man auch nicht verstehen, wie er im Einzelnen wirkt. Schaut man sich den von diesen Programmen erzeugten JavaScript-Quelltext doch an, so ist er sehr oft in einem Wust von automatisch erstellten Tabellen, Layern und Platzhalter-Grafiken kaum noch auszumachen. Daher ist es schwer, Unerwünschtes aus den automatisch erzeugten Skripten zu beseitigen oder sie, wo gewünscht oder notwendig, zu verbessern. Gerechterweise muss man anmerken, dass diese Programme und ihre Nutzer oft auch andere Ziele verfolgen. Beispielsweise sind Office-Programme gar nicht dafür entwickelt worden, dass man mit ihnen (X)HTML-Dokumente erstellt, sondern sie bieten nur nebenbei an, „auf die Schnelle“ einen Text, eine Präsentation oder eine Tabelle fürs Netz tauglich abzuspeichern, scheitern in der Praxis aber meist daran, dies in einer qualitativ brauchbaren und verständlichen Weise zu tun, weil sie ja nicht wirklich verstehen, was der Autor inhaltlich gemeint hat – als Schnittstelle für Programmieraufgaben oder zum Erlernen von JavaScript sind sie nicht geeignet.

Es ist unbedingt davon abzuraten, MS-Word oder ähnliche Schreibprogramme als Editoren zum Programmieren zu benutzen!

(X)HTML-Editoren für die direkte Arbeit am Quelltext

Gut geeignet für die Erstellung von (X)HTML-Seiten mit JavaScript-Elementen unter Microsoft Windows sind zum Beispiel diese für für den Privatgebrauch kostenfrei erhältlichen Editoren:

Für Linux sind in allen gängigen Distributionen brauchbare Editoren wie Kate oder Gedit vorinstalliert.

Empfehlung: Ein Editor mit vordefinierten Makros kann zwar das Programmiererleben ungemein erleichtern, aber in der ersten Lernphase verstellen solche Hilfen den Blick auf das Wesentliche und erschweren das Lernen.
Wer immer nur Fertigtütensuppen aufkocht, lernt nicht kochen, sondern kann noch nicht einmal die notwendigen Zutaten für ein Gericht benennen und erkennen.

Nur sehr eingeschränkt zu empfehlen ist der NVU-Composer. Letzte Version 1.0 ist vom 20.6.2005! Das Beste, was man über das Programm sagen kann, ist, dass es kostenlos verfügbar ist; leider aber verhält sich das Programm destruktiv gegenüber dem Quelltext in (X)HTML-Dokumenten, das heißt es reformatiert Quelltext nach seinen internen Vorgaben um, egal, ob dies negative Folgen hat und vom Anwender gewünscht wird oder nicht. Nachfolger ist der CompoZer 0.7.10 vom 30.8.2007. In der englischen Version mit deutschen Sprachpaket verhält er sich aber noch immer so, wird aber offenbar weiterentwickelt. Ebenso ist abzuraten vom IceApe Composer bzw. dem Mozilla Editor. Nur wer seine Arbeit gerne drei oder viermal macht statt einmal richtig, sollte einen dieser Editoren benutzen!

Weiterführende (Online-)Literatur

Als dieses Wikibook ins Leben gerufen wurde, gab es viele andere Quellen noch nicht. Daher erschien die Erstellung des Buches mehr oder weniger notwendig.
Mittlerweile gibt es so gute Tutorials, dass einem die Motivation für die Weiterentwicklung dieses Buches verloren geht. Man sieht es unter anderem auch daran, dass dieses Buch seit 2015 nicht mehr bearbeitet wurde. Das vorhandene Material ist gut und in Ordnung - vermutlich wird es aber nicht erweitert werden.

Diesen Umfang und diese Perfektion werden Einzelkämpfer wie der Initiator dieses Buches wohl nie erreichen.

Aufgaben + Lösungen

<< Titel | Inhaltsverzeichnis | Index | Weblinks | Tutorial >>