Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- de:modul:m307:learningunits:lu09:01 [2025/12/01 23:04] – angelegt vdemir
+++ de:modul:m307:learningunits:lu09:01 [2026/06/02 13:20] (aktuell) – gelöscht vdemir
@@ Zeile 1: / Zeile 1: @@
-====== LU09a - HTML-DOM ======
-===== Lernziele =====
-  - ???
-===== Einleitung =====
-Der Begriff **HTML-DOM (Document Object Model) bezeichnet die strukturierte, hierarchische Repräsentation eines HTML-Dokuments in einer Form, die von Programmiersprachen verarbeitet werden kann. Sobald ein Webbrowser eine HTML-Datei lädt, erzeugt er aus dem Dokument eine baumartige Datenstruktur, in der jedes HTML-Element (z. B. <body>, <div>, <p>) als eigener Knoten dargestellt wird.
-{{:de:modul:m307:learningunits:lu09:dom-tree1.png?600|HTML-DOM als Baumstruktur}}
- Attribute, Textinhalte und Beziehungen zwischen Elementen werden ebenfalls in dieser Struktur abgebildet.
-{{:de:modul:m307:learningunits:lu09:dom-tree2.png?600|Attribute, Inhalt und Beziehungen}}
-===== Zusammenhang mit JavaScript =====
-JavaScript nutzt das DOM, um Inhalte einer Webseite dynamisch zu verändern, ohne die Seite neu zu laden. Der DOM-Baum dient hierbei als Schnittstelle: JavaScript kann auf jedes Element zugreifen, Eigenschaften auslesen, Werte ändern, neue Elemente erzeugen oder bestehende entfernen. Dadurch wird die statische HTML-Struktur in ein interaktives und reagierendes System überführt.
-===== Zugriff auf DOM-Elemente =====
-JavaScript stellt verschiedene Methoden bereit, um auf Knoten im DOM zuzugreifen. Beispiele sind:
-===== Lernvideos =====
-<color #ed1c24>TBD</color>
-===== Zusatzmaterial =====
-  * [[https://www.w3schools.com/js/js_htmldom.asp|W3School - HTML-DOM]]
-  * [[https://wiki.selfhtml.org/wiki/JavaScript/DOM|SelfHTML- HTML DOM]]
-----
-[[https://creativecommons.org/licenses/by-nc-sa/4.0/|{{https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png}}]] Volkan Demir