Zum Inhalt springen

Manipulation des DOM mit JavaScript

Schritt 2 von 7

Hinzufügen und Entfernen von Elementen Um Elemente dynamisch zu verändern, können wir sie hinzufügen oder entfernen. Hier ist ein Beispiel, wie man einen neuen Text-Nachricht hinzufügt:

<!-- html ... -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DOM Manipulation</title>
</head>
<body>
<button id="myButton">Klicke mich</button>
</body>
</html>
// javascript ...
document.getElementById('myButton').onclick = function() {
var newParagraph = document.createElement('p');
newParagraph.innerHTML = 'Dies ist eine neue Nachricht.';
document.body.appendChild(newParagraph);
}

Dieses Skript fügt einen neuen p-Element mit Text zum body hinzu.