JavaScript HTML DOM

Durch das HTML DOM kann JavaScript alle Elemente des HTML-Dokuments zugreifen und ändern.

HTML DOM (Dokumentobjektmodell)

Wenn eine Webseite geladen wird, erstellt der Browser das Dokumentobjektmodell der Seite (Document Object Model).

HTML DOM Das Modell wird strukturiertObjektbaum:

Das HTML-DOM-Baumobjekt

DOM HTML Baum

Durch diese Objektmodelle erhält JavaScript alle Kräfte, um dynamisches HTML zu erstellen:

  • JavaScript kann alle HTML-Elemente auf der Seite ändern
  • JavaScript kann alle HTML-Attribute auf der Seite ändern
  • JavaScript kann alle CSS-Styles auf der Seite ändern
  • JavaScript kann bestehende HTML-Elemente und Attribute löschen
  • JavaScript kann neue HTML-Elemente und Attribute hinzufügen
  • JavaScript kann auf alle bestehenden HTML-Ereignisse auf der Seite reagieren
  • JavaScript kann neue HTML-Ereignisse auf der Seite erstellen

Was werden Sie lernen

In den folgenden Kapiteln dieses Tutorials werden Sie lernen:

  • Wie kann man den Inhalt eines HTML-Elements ändern?
  • Wie ändere ich den Stil von HTML-Elementen (CSS)?
  • Wie reagiere ich auf HTML DOM Ereignisse?
  • Wie füge ich HTML-Elemente hinzu und entferne sie?

Was ist DOM?

DOM ist ein Standard des W3C (World Wide Web Consortium).

DOM definiert die Standards für den Zugriff auf das Dokument:

„Der W3C-Document Object Model (DOM) ist eine plattform- und sprachunabhängige Schnittstelle, die es Programmen und Skripten ermöglicht, den Inhalt, die Struktur und das Stil der Dokumente dynamisch zu erreichen und zu aktualisieren.“

Der W3C DOM-Standard wird in 3 verschiedene Teile unterteilt:

  • Core DOM - Standardmodell für alle Dokumenttypen
  • XML DOM - Standardmodell des XML-Dokuments
  • HTML DOM - Standardmodell des HTML-Dokuments

Was ist HTML DOM?

HTML DOM ist die Norm für HTMLObjekteModelle undProgrammierschnittstelle. Es definiert:

  • alsObjekteder HTML-Elemente
  • alle HTML-ElementeEigenschaften
  • Zugriff auf alle HTML-ElementeMethoden
  • alle HTML-ElementeEreignisse

Kurz gesagt: HTML DOM ist die Norm zur Erreichung, Änderung, Hinzufügung oder Entfernung von HTML-Elementen.