View
103
Download
0
Category
Preview:
Citation preview
Einführung in dasProgrammieren mit JavaScript
Mag. Andreas Starzer
weloveIT – EDV Dienstleistungen
Themen
I. Überblick JavaScript
II. Einbindung von JavaScript in HTML
III. Notationsregeln
IV. Variablen und Operatoren
V. Bedingungen
VI. Schleifen
VII. Funktionen
VIII. Ereignisse
IX. 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
II Einbindung von JavaScript
3 Varianten der Einbindung
Definition eines Scriptbereiches mit
<script type="text/javascript"> </script> Einbinden einer externen JavaScript-Datei mit
<script type="text/javascript" src="script.js"> </script> Definition eines Scripts direkt als Reaktion auf ein
Ereignis
<body onLoad="script…">
Kapitel III
Notationsregeln
III NotationsregelnFolgende 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
IV Variablen 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
V Bedingungen
If..Then..Else
IF (Vergleich) { Anweisung; Anweisung;
}ELSE { Anweisung; Anweisung;
}
V Bedingungen
Switch..Case..Break
SWITCH (Variable)
{
CASE 1:
Anweisung;
BREAK;
CASE 2:
Anweisung;
BREAK;
}
Kapitel VI
Schleifen
VI Schleifen
For..
FOR (Initialisierung; Bedingung; Inkrement)
{
Anweisung;
Anweisung;
}
VI Schleifen
While..
WHILE (Bedingung)
{
Anweisung;
Anweisung;
}
VI Schleifen
Do..While
DO
{
Anweisung;
Anweisung;
}
WHILE (Bedingung)
VI Schleifen
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
VII Funktionen
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
VII Funktionen
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: http://dcljs.de/
Recommended