Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen

Themen I.Überblick JavaScriptÜberblick JavaScript II.Einbindung von JavaScript in HTMLEinbindung von JavaScript in HTML III.NotationsregelnNotationsregeln IV.Variablen und OperatorenVariablen und Operatoren V.BedingungenBedingungen VI.SchleifenSchleifen VII.FunktionenFunktionen VIII.Ereignisse IX.Objekte (DOM)Objekte (DOM)

Kapitel I Überblick JavaScript

IÜberblick JavaScript JavaScript ist eine Scriptsprache ist objektorientiert ist auf den meisten Browsern lauffähig (Navigator, Explorer, Opera etc.) ist in vielen Programmen Makrosprache (zB Acrobat) ist wesentliches Element von DynamicHTML ist NICHT Java

Kapitel II Einbindung von JavaScript in HTML

IIEinbindung von JavaScript 3 Varianten der Einbindung Definition eines Scriptbereiches mit Einbinden einer externen JavaScript-Datei mit Definition eines Scripts direkt als Reaktion auf ein Ereignis

Kapitel III Notationsregeln

IIINotationsregeln Folgende Notationsregeln sind zu beachten Befehlszeilen enden mit ; Blöcke (zB If..Then, For..) werden in { } gestellt Namen –müssen mit einem Buchstaben beginnen –dürfen nur die Zeichen 0-9, a-z, A-Z und _ enthalten –dürfen kein reserviertes Wort sein Kommentare –stehen zwischen /* und */ –oder nach //

Kapitel IV Variablen und Operatoren

IVVariablen und Operatoren Variablen können durch die Anweisung var Name; deklariert werden brauchen einen eindeutigen Namen können lokal (innerhalb eines Blocks oder einer Funktion) oder global gültig sein

IV Variablen und Operatoren Operatoren Zuweisungs-: = Vergleichs-: == = != Mathematische: + - / * % mathematische mit Zuweisung: += -= *= /= %= In- bzw. Dekrement-: Bool´sche: && (und) || (oder) ! (nicht) Zeichenketten-: + (aneinanderhängen)

Kapitel V Bedingungen

VBedingungen If..Then..Else IF (Vergleich) { Anweisung; } ELSE { Anweisung; }

VBedingungen Switch..Case..Break SWITCH (Variable) { CASE 1: Anweisung; BREAK; CASE 2: Anweisung; BREAK; }

Kapitel VI Schleifen

VISchleifen For.. FOR (Initialisierung; Bedingung; Inkrement) { Anweisung; }

VISchleifen While.. WHILE (Bedingung) { Anweisung; }

VISchleifen Do..While DO { Anweisung; } WHILE (Bedingung)

VISchleifen Schleifenabbruch Break –unterbricht die Schleife und setzt bei der Anweisung nach der Schleife fort Continue –unterbricht die Schleife und setzt die Schleife beim nächsten Durchlauf fort

Kapitel VII Funktionen

VIIFunktionen Funktionen Sind Anweisungen, die unter einem Namen zusammengefasst sind Werden erst ausgeführt, wenn sie aufgerufen werden Können Werte beim Aufruf übernehmen und Werte zurückgeben JavaScript kennt einige vordefinierte Funktionen – zB isNaN(Variable) – überprüft ob eine Variable eine Zahl enthält

VIIFunktionen Deklaration FUNCTION Funktionsame(Parameter, Parameter) { Anweisungen; } Aufruf einer Funktion Variable = Funktionsname(Wert, Wert) Wertrückgabe RETURN Wert;

Kapitel VIII Ereignisse

VIII Ereignisse Ereignisse Bieten dem Programmierer die Möglichkeit auf bestimmte Aktionen des Benutzers zu reagieren Können eine Funktion aufrufen oder direkt mit Anweisungen verbunden werden Wichtige Ereignisse: –onClick –onMouseover –onSubmit –onLoad

Kapitel IX Objekte (DOM)

IX Objekte (DOM) Das Document Object Model Bietet Scriptsprachen die Möglichkeit, gezielt die Objekte einer Webseite zu manipulieren Reiht die Objekte in einer Baumstruktur und bildet Haupt- und Unterobjekte Der Zugriff auf die Objekte erfolgt –über deren Namen –über deren ID

IX Objekte (DOM) Wichtige Objekte window frames document forms images

IX Objekte (DOM) window Ist das oberste Element (das Browserfenster) und beinhaltet alle Objekte, die im Browser sichtbar sind Wichtige Eigenschaften: –outerHeight, outerWidth –toolbars, scrollbars, menubar, statusbar Wichtige Methoden: –print –open, close

IX Objekte (DOM) frames Erlaubt den Zugriff auf die Frames einer Seite Frames können über ihren Namen angesprochen werden, zB parent.Framename Wichtige Eigenschaften: –wie beim window-Objekt –length Wichtige Methoden: –wie beim window-Objekt

IX Objekte (DOM) document Ist das oberste Objekt, das im Browserfenster angezeigt wird (die HTML-Seite) Wichtige Eigenschaften: –bgColor –URL Wichtige Methoden: –open, close –write, writeln –getElementsByName, GetElementsByID

IX Objekte (DOM) forms Bietet Zugriff auf Formulare und deren Objekte Wichtige Eigenschaften: –action –method Wichtige Methoden: –submit –reset

IX Objekte (DOM) images Ist eine Sammlung aller Bilder einer Seite die über deren Nummer angesprochen werden Wichtige Eigenschaften: –height, width –src –border

X Beispiele Live Demonstration von Beispielen Weitere Infos unter: