Dies ist eine alte Version des Dokuments!
LU08c - DOM-Methoden - TBD
Lernziele
- ???
JavaScript DOM-Selektoren kompakte Übersicht
Die folgenden Methoden dienen dazu, HTML-Elemente im Dokument (DOM) zu finden und zu manipulieren. Jede Methode arbeitet etwas anders und eignet sich für unterschiedliche Zwecke.
1. document.getElementById()
- Findet genau ein Element anhand seiner ID.
- IDs sind im Dokument eindeutig – ideal ein Element gezielt angesprochen werden soll.
Syntax
document.getElementById("idName");
Codebeispiel
<p id="titel">Hallo Welt</p>
<script>
document.getElementById("titel").innerHTML = "Text erfolgreich geändert!";
</script>
2. document.getElementsByClassName()
- Liefert alle Elemente einer bestimmten CSS-Klasse als HTMLCollection (ähnlich wie ein Array).
- Für einzelne Elemente muss man über den Index zugreifen:
Syntax
document.getElementsByClassName("className")[index];
Codebeispiel
<p class="info">Erster Text</p>
<p class="info">Zweiter Text</p>
<script>
document.getElementsByClassName("info")[0].innerHTML = "Ich bin geändert!";
document.getElementsByClassName("info")[1].style.color = "red";
</script>
Lernvideos
TBD
