Download - Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen
![Page 1: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/1.jpg)
Einführung in dasProgrammieren mit JavaScript
Mag. Andreas Starzer
weloveIT – EDV Dienstleistungen
![Page 2: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/2.jpg)
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)
![Page 3: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/3.jpg)
Kapitel I
Überblick JavaScript
![Page 4: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/4.jpg)
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
![Page 5: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/5.jpg)
Kapitel II
Einbindung von JavaScript in HTML
![Page 6: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/6.jpg)
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…">
![Page 7: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/7.jpg)
Kapitel III
Notationsregeln
![Page 8: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/8.jpg)
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 //
![Page 9: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/9.jpg)
Kapitel IV
Variablen und Operatoren
![Page 10: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/10.jpg)
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
![Page 11: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/11.jpg)
IV Variablen und Operatoren
Operatoren
Zuweisungs-: = Vergleichs-: == < > <= >= != Mathematische: + - / * % mathematische mit Zuweisung: += -= *= /= %= In- bzw. Dekrement-: ++ -- Bool´sche: && (und) || (oder) ! (nicht) Zeichenketten-: + (aneinanderhängen)
![Page 12: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/12.jpg)
Kapitel V
Bedingungen
![Page 13: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/13.jpg)
V Bedingungen
If..Then..Else
IF (Vergleich) { Anweisung; Anweisung;
}ELSE { Anweisung; Anweisung;
}
![Page 14: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/14.jpg)
V Bedingungen
Switch..Case..Break
SWITCH (Variable)
{
CASE 1:
Anweisung;
BREAK;
CASE 2:
Anweisung;
BREAK;
}
![Page 15: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/15.jpg)
Kapitel VI
Schleifen
![Page 16: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/16.jpg)
VI Schleifen
For..
FOR (Initialisierung; Bedingung; Inkrement)
{
Anweisung;
Anweisung;
}
![Page 17: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/17.jpg)
VI Schleifen
While..
WHILE (Bedingung)
{
Anweisung;
Anweisung;
}
![Page 18: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/18.jpg)
VI Schleifen
Do..While
DO
{
Anweisung;
Anweisung;
}
WHILE (Bedingung)
![Page 19: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/19.jpg)
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
![Page 20: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/20.jpg)
Kapitel VII
Funktionen
![Page 21: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/21.jpg)
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
![Page 22: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/22.jpg)
VII Funktionen
Deklaration
FUNCTION Funktionsame(Parameter, Parameter){ Anweisungen; }
Aufruf einer Funktion
Variable = Funktionsname(Wert, Wert)
Wertrückgabe
RETURN Wert;
![Page 23: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/23.jpg)
Kapitel VIII
Ereignisse
![Page 24: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/24.jpg)
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
![Page 25: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/25.jpg)
Kapitel IX
Objekte (DOM)
![Page 26: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/26.jpg)
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
![Page 27: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/27.jpg)
IX Objekte (DOM)
Wichtige Objekte
window frames document forms images
![Page 28: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/28.jpg)
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
![Page 29: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/29.jpg)
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
![Page 30: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/30.jpg)
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
![Page 31: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/31.jpg)
IX Objekte (DOM)
forms
Bietet Zugriff auf Formulare und deren Objekte Wichtige Eigenschaften:
– action– method
Wichtige Methoden:– submit– reset
![Page 32: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/32.jpg)
IX Objekte (DOM)
images
Ist eine Sammlung aller Bilder einer Seite die über deren Nummer angesprochen werden
Wichtige Eigenschaften:– height, width– src– border
![Page 33: Einführung in das Programmieren mit JavaScript Mag. Andreas Starzer weloveIT – EDV Dienstleistungen](https://reader036.vdocuments.pub/reader036/viewer/2022070310/55204d7049795902118c18af/html5/thumbnails/33.jpg)
X Beispiele
Live Demonstration von Beispielen
Weitere Infos unter: http://dcljs.de/