| Jede HTML-Webseite ist in Form eines Objekt-Baums nach dem universellen Document Object Model (DOM) organisiert. | Javascript hat Zugang zu jedem einzelnen Element: Man kann mit DOM-Methoden alle Elemente einer Webseite lesen und ändern. |
| "Dynamisches" Verhalten von Webseiten ist alternativ auch mit Server-seitigen Programmen (PHP, Perl, ...) zu erzielen. | Javascript-Lösungen haben den Vorteil, den Webserver zu entlasten, und die Programme auf den technisch immer leistungsfähigeren Client-PC auszuführen. |
Javascript
|
ECMAScript für HTML und XML (DOM-Methoden) |
| Knoten-Elemente | Arbeit mit DOM-Knoten (nodes) |
DOM-Knoten adressieren / identifizieren |
|
DOM-Knoten lesen, ändern, erzeugen & löschen |
|
nodeName, nodeType, nodeValue, ... |
|
Auf (parentNode) und ab (childNodes) im Objekt-Baum |
|
| Spezialfälle | |
Daten von Attributen lesen, ändern, erzeugen & löschen |
|
#text-Knoten sind die "Endpunkte" im DOM-Baum |
|
Das style-Unterobjekt von DOM-Knoten |
|
In styleSheet-Objekten sind CSS-Regeln festgelegt |
|
| Ereignisse | Reaktion auf Ereignisse (events) - z.B. Tastatur, Maus, .. |
| Beispiele | |
Monats-Kalender mit DOM-Methoden |
|
Java-Applets und SVG-Grafiken mit DOM-Methoden steuern |
|
| Links |
|
|
|
DOM-Homepage beim W3C
|
Mozilla:
Gecko DOM Reference
|
| Gecko: Mehrere ausgezeichnete Browser basieren auf der Gecko-Technologie, z.B. Firefox. Für die kostenlosen Browser Firefox und Mozilla gibt es den DOM-Inspector: Menübefehl: Tools | Web Development. Gute Developer-Area ! | |
|