Zum Inhalt springen

Einführung in das DOM

Schritt 1 von 7

In diesem Schritt lernen wir über das Dokument Objekt Modell (DOM) in JavaScript. Das DOM ist wie ein Baumstruktur, der alle Elemente in einer Webseite repräsentiert. Jedes Element, Text und Attribut in einer HTML-Datei ist ein Knoten in diesem Baum. JavaScript kann diesen Baum manipulieren, um Inhalte dynamisch zu ändern. Im folgenden Beispiel sehen wir, wie wir ein Element anlegen und es in die Webseite einfügen:

<!-- HTML -->
<!DOCTYPE html>
<html>
<head>
<title>DOM Beispiel</title>
</head>
<body>
<h1 id="title">Willkommen auf meiner Seite!</h1>
<script>
// JavaScript
var title = document.getElementById('title');
console.log(title.textContent);
</script>
</body>
</html>