Sie sind hier
E-Book

JavaScript und Ajax

Das Praxisbuch für Web-Entwickler

AutorJan Winkler
VerlagFranzis
Erscheinungsjahr2012
Seitenanzahl448 Seiten
ISBN9783772349508
FormatePUB/PDF
KopierschutzWasserzeichen/DRM
GerätePC/MAC/eReader/Tablet
Preis24,99 EUR
Fast alle Webseiten haben eines gemeinsam: Sie bestehen aus JavaScript-, HTML- und CSS-Code. Während HTML und CSS stagnieren, hat sich Java- Script mit Ajax zur dominierenden Web-2.0-Technik weiterentwickelt. Dieses Buch vermittelt anhand konkreter Programmierbeispiele die Grundlagen und einige fortgeschrittene Techniken von JavaScript und Ajax.

Jan Winkler ist erfolgreicher Internet-Publisher und leitet ein großes Online-Vermarktungsunternehmen. Er lebt in Berlin.

Kaufen Sie hier:

Horizontale Tabs

Leseprobe

2  JavaScript-Grundlagen

JavaScript ist eines der mächtigsten Werkzeuge für jeden Web-Entwickler und kann mit wenigen Handgriffen und einfachem Code für neues Leben in nahezu jeder Website sorgen. Darüber hinaus bildet es die Basis für alle Techniken, die im Folgenden beschrieben werden, und ist daher elementarer Bestandteil einer jeden DHTML- oder Ajax-Anwendung. In diesem Kapitel wollen wir Ihnen einen umfassenden Einblick in die JavaScript-Programmierung bieten und Ihnen die Werkzeuge an die Hand geben, die Sie für spätere Entwicklungsaufgaben benötigen.

2.1  Einführung

Was ist JavaScript eigentlich? Grob gesagt, ist JavaScript eine Programmiersprache, mit deren Hilfe zum Beispiel innerhalb des Browsers bestimmte Aktionen durchgeführt werden können. Zu diesen Aktionen gehören etwa das Auswerten von Formularen, das Auslesen und Schreiben von Cookies oder einfach das Öffnen eines neuen Browser-Fensters (das sogenannte Popup).

Was ist JavaScript?

Genau genommen, ist JavaScript eine Technologie, um relativ einfache Programmabläufe erstellen zu können. Die Syntax der Sprache ist, wie der Name vermuten lässt, stark an die Programmiersprache Java angelehnt – wer Java schon kennt, wird demnach mit JavaScript keine Probleme haben. In den häufigsten Fällen wird JavaScript innerhalb des Browsers zur Steuerung des Browser-Inhalts beziehungsweise zur Interaktion mit dem Benutzer eingesetzt. Darüber hinaus gibt es jedoch auch Software-Umgebungen, in denen JavaScript direkt auf dem Server eingesetzt wird. Da diese Varianten jedoch kaum Verbreitung gefunden haben, ist in der Regel clientseitiges JavaScript gemeint, wenn von JavaScript die Rede ist.

Entstehung

JavaScript kann auf eine für IT-Verhältnisse schon recht lange Geschichte zurückblicken. Ursprünglich entwickelt wurde es um 1996 von der Firma Netscape, von der damals auch der beliebteste Browser stammte (inzwischen ist Netscape in AOL aufgegangen, der Browser-Code ist in das Mozilla-Projekt und den Firefox-Browser eingeflossen). Der Name sollte ursprünglich LiveScript heißen, wurde jedoch aufgrund der damaligen enormen Bekanntheit und der angelehnten Syntax nach der Programmiersprache Java benannt. Im Zuge der Rivalität zwischen Microsofts Internet Explorer und Netscapes Navigator wurde auch die Entwicklung von JavaScript vorangetrieben, die jedoch mit dem Ende des sogenannten »ersten Browser-Kriegs« (zwischen Microsoft und Netscape) und dem Rückzug Netscapes aus der Browser-Welt ins Stocken geriet. Bislang sind sechs Versionen (1.0 bis 1.5) entstanden, die sich jeweils durch Neuerungen in Sachen Syntax und verfügbarer Code-Objekte (Bibliotheken) unterscheiden[1]. Aktuell wurde außerdem eine neue Version von ECMAScript (die standardisierte Form von JavaScript) herausgegeben, die jedoch in den aktuellen Browsern noch nicht implementiert wurde. In diesem Zusammenhang ist auch die Version 2.0 von JavaScript bereits seit Langem in Vorbereitung.

Client- und serverseitig

JavaScript ist weitestgehend eine clientseitige Sprache, das heißt, sie wird vorwiegend im Browser ausgeführt und kommt nur selten direkt auf dem Webserver zum Einsatz. Der Browser lädt dazu vom Server die Website (das HTML-Dokument) herunter und durchsucht es nach Vorkommen von JavaScript-Code. Wird solcher Code gefunden, wird er ausgeführt und je nach Inhalt und Ergebnis angezeigt beziehungweise ausgegeben.

Effektiv auf einem Server zum Einsatz gekommen sind lediglich SSJS (Serverside JavaScript) – ein Feature von Netscapes damaliger Webserver-Software – sowie die Möglichkeit, bei Microsofts ASP-Implementation statt der Sprache VBScript auch JScript (Microsofts JavaScript-Variante) einzusetzen. In der Praxis sind allerdings weder Netscapes Webserver noch ASP mit JScript von Bedeutung.

Versionen und Browser

Je nach Browser-Hersteller und -Version werden jeweils nur eine bestimmte JavaScript-Version oder teilweise sogar nur Teile einer bestimmten Version unterstützt. Darüber hinaus war es lange Zeit der Fall, dass die beiden meistverwendeten Browser Microsoft Internet Explorer und Netscape Navigator (jetzt Mozilla Firefox) teils gegenläufige Methoden, Objekte und Technologien unterstützten und damit jedem Programmierer die Arbeit schwer machten, wenn dieser versuchte, die Website für möglichst alle Browser zugänglich zu machen. Dies ist zum Glück mittlerweile nicht mehr von so tragender Bedeutung. Zwar existieren immer noch diverse Browser, die JavaScript teils sehr unterschiedlich beherrschen – aufgrund der sehr weiten Verbreitung des Internet Explorer 6, 7 beziehungsweise 8 sowie des Mozilla Firefox 1.5, 2 beziehungsweise 3 und der damit einhergehenden Vereinheitlichung sind wir mittlerweile jedoch an einem Punkt, an dem das Thema der Browser-Version für JavaScript allein eine eher untergeordnete Rolle spielt. Einzig bei neueren Technologien wie Ajax bestehen leider immer noch Probleme, wenn es um Browser-Kompatibilität geht – dazu aber an der jeweiligen Stelle dann mehr.

2.2  Erste Schritte

Nun ist es an der Zeit, dass wir uns konkret mit der Programmierung von JavaScript beschäftigen. Um Ihnen den Einstieg zu erleichtern, werden wir mit sehr einfachen Beispielen beginnen und uns im Verlauf dann komplexeren und umfangreicheren Themen widmen.

Wie fange ich an?

Für alle Schritte in diesem Kapitel benötigen Sie zunächst einmal einen Editor beziehungsweise eine Möglichkeit, den hier gezeigten Beispiel-Code in eine Datei einzugeben. Im vorhergehenden Kapitel haben wir Ihnen dazu einige Programme vorgestellt – nun ist es an der Zeit, eines davon einzusetzen: Öffnen Sie das Programm Ihrer Wahl, und legen Sie eine neue, leere HTML-Datei an, in die Sie den Code einfügen können. In Eclipse geschieht dies über den Button »New« und die Auswahl »Web > HTML«.

JavaScript und HTML

Wie eingangs erwähnt, wird JavaScript-Code direkt in das HTML-Dokument hineingeschrieben. Damit der Browser JavaScript-Code von normalem Text unterscheiden kann, wird dieser innerhalb eines <script>-Elements notiert. Ein einfaches Beispiel hierzu:

<html> <head> ... </head> <body> <script type="text/javascript" language="JavaScript"> <!-- alert('Ich bin internes JavaScript!'); //--> </script> </body> </html>

Im obigen Beispiel findet sich ein <script>-Abschnitt, welcher den Code direkt in ein HTML-Dokument einbettet. Dieser wird hier innerhalb der Tags <script ... > und </script> in einen HTML-Kommentar gesetzt (damit ältere Browser keine Probleme haben). In diesem Beispiel besteht der JavaScript-Code also aus der einen Zeile …

alert('Ich bin JavaScript!')

… welche die Ausgabe des Textes innerhalb eines kleinen Meldungsfensters hervorruft. Speichern Sie die Datei zum Beispiel als test.html und öffnen Sie sie in einem Browser. Anschließend wird etwa folgendes Fenster angezeigt:

Bild 2.1  Der alert-Aufruf zeigt eine Meldung an.

Glückwunsch, Ihr erstes kleines Skript ist fertig!

JavaScript in einer externen Datei

Wenn die Skripte einmal umfangreicher werden oder etwa innerhalb mehrerer Seiten genutzt werden sollen, kann JavaScript-Code ganz einfach in eine externe Datei ausgelagert und von allen anderen Dateien darauf zugegriffen werden. Um dies zu tun, wird der Code aus dem <script>-Abschnitt ausgeschnitten und in eine neue Datei kopiert. Gehen Sie hier wie folgt vor:

  1. Öffnen Sie eine neue, völlig leere (JavaScript-)Datei, und geben Sie dieser den Dateinamen extern.js.
  2. Schneiden Sie den JavaScript-Code aus dem obigen Beispiel aus der Datei aus (ohne den Kommentar-Code, also nur die Zeile alert('Ich bin internes JavaScript!');).
  3. Fügen Sie den ausgeschnittenen Code in die Datei extern.js ein, und speichern Sie diese im gleichen Verzeichnis, in dem sich auch die HTML-Datei befindet.
  4. Ändern Sie den <script>-Abschnitt in der HTML-Datei in:
    <script type="text/javascript" language="JavaScript" src="extern.js"></script>

Wie im Beispiel zu sehen, wird innerhalb des src-Attributs die Datei benannt, in der sich der JavaScript-Code befindet. Findet der Browser in einem HTML-Dokument einen <script>-Abschnitt, in dem dieses Attribut enthalten ist, wird die benannte Datei nachgeladen und...

Blick ins Buch

Weitere E-Books zum Thema: Internet - Intranet - Webdesign - Security

Internet für Psychologen

E-Book Internet für Psychologen
Format: PDF

Das Internet kurz zu erklären und gleichzeitig einen aktuellen Überblick über psychologische Themen und Forschungsschwerpunkte zu geben, ist wohl ein hoffnungsloses Unterfangen. Zu…

Internet für Psychologen

E-Book Internet für Psychologen
Format: PDF

Das Internet kurz zu erklären und gleichzeitig einen aktuellen Überblick über psychologische Themen und Forschungsschwerpunkte zu geben, ist wohl ein hoffnungsloses Unterfangen. Zu…

Internet für Psychologen

E-Book Internet für Psychologen
Format: PDF

Das Internet kurz zu erklären und gleichzeitig einen aktuellen Überblick über psychologische Themen und Forschungsschwerpunkte zu geben, ist wohl ein hoffnungsloses Unterfangen. Zu…

Internet für Psychologen

E-Book Internet für Psychologen
Format: PDF

Das Internet kurz zu erklären und gleichzeitig einen aktuellen Überblick über psychologische Themen und Forschungsschwerpunkte zu geben, ist wohl ein hoffnungsloses Unterfangen. Zu…

Texten für das Web

E-Book Texten für das Web
Erfolgreich werben, erfolgreich verkaufen Format: PDF

Dieses Buch bietet das nötige Handwerkszeug, um die Qualität der eigenen Web-Texte zu verbessern bzw. eingekaufte Texte sicherer beurteilen zu können. Es liefert klare Kriterien für die Textanalyse,…

Texten für das Web

E-Book Texten für das Web
Erfolgreich werben, erfolgreich verkaufen Format: PDF

Dieses Buch bietet das nötige Handwerkszeug, um die Qualität der eigenen Web-Texte zu verbessern bzw. eingekaufte Texte sicherer beurteilen zu können. Es liefert klare Kriterien für die Textanalyse,…

Texten für das Web

E-Book Texten für das Web
Erfolgreich werben, erfolgreich verkaufen Format: PDF

Dieses Buch bietet das nötige Handwerkszeug, um die Qualität der eigenen Web-Texte zu verbessern bzw. eingekaufte Texte sicherer beurteilen zu können. Es liefert klare Kriterien für die Textanalyse,…

TCP/IP-Praxis

E-Book TCP/IP-Praxis
Dienste, Sicherheit, Troubleshooting Format: PDF

Netzwerke modernen Standards verlangen weniger nach Rezepten für Neu - Design als vielmehr nach Wegen, Maßnahmen zur Integration in eine bestehende Infrastruktur aufzuzeigen. Diesem Aspekt trägt TCP/…

E-Learning

E-Book E-Learning
Einsatzkonzepte und Geschäftsmodelle Format: PDF

Der vorliegende Band ist dem Lernen und Lehren auf der Basis moderner Informations- und Kommunikationstechnologien gewidmet. Das Buch fasst die wichtigsten Ansätze zur Einführung, Umsetzung und…

E-Learning

E-Book E-Learning
Einsatzkonzepte und Geschäftsmodelle Format: PDF

Der vorliegende Band ist dem Lernen und Lehren auf der Basis moderner Informations- und Kommunikationstechnologien gewidmet. Das Buch fasst die wichtigsten Ansätze zur Einführung, Umsetzung und…

Weitere Zeitschriften

FREIE WERKSTATT

FREIE WERKSTATT

Die Fachzeitschrift FREIE WERKSTATT berichtet seit der ersten Ausgaben 1994 über die Entwicklungen des Independent Aftermarkets (IAM). Hauptzielgruppe sind Inhaberinnen und Inhaber, Kfz-Meisterinnen ...

AUTOCAD Magazin

AUTOCAD Magazin

Die herstellerunabhängige Fachzeitschrift wendet sich an alle Anwender und Entscheider, die mit Softwarelösungen von Autodesk arbeiten. Das Magazin gibt praktische ...

cards Karten cartes

cards Karten cartes

Die führende Zeitschrift für Zahlungsverkehr und Payments – international und branchenübergreifend, erscheint seit 1990 monatlich (viermal als Fachmagazin, achtmal als ...

EineWelt

EineWelt

Lebendige Reportagen, spannende Interviews, interessante Meldungen, informative Hintergrundberichte. Lesen Sie in der Zeitschrift „EineWelt“, was Menschen in Mission und Kirche bewegt Man kann ...

building & automation

building &amp; automation

Das Fachmagazin building & automation bietet dem Elektrohandwerker und Elektroplaner eine umfassende Übersicht über alle Produktneuheiten aus der Gebäudeautomation, der Installationstechnik, dem ...

Euphorion

Euphorion

EUPHORION wurde 1894 gegründet und widmet sich als „Zeitschrift für Literaturgeschichte“ dem gesamten Fachgebiet der deutschen Philologie. Mindestens ein Heft pro Jahrgang ist für die ...