Mit JavaScript Teile aus HTML löschen

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Haevelin

Neues Mitglied
25 Oktober 2021
1
0
1
54
Folgende Aufgabe: Ergänzen Sie die Datei so, dass per Knopfdruck die dynamisch hinzugefügten Textzeilen wieder entfernt werden können.

Folgender Code:




<html>
<head>
<title>Add text</title>
<script language="JavaScript">
document.addEventListener('DOMContentLoaded', function () {
var text = 'Dies ist noch mehr Typoblindtext.';
document.getElementById('knopf').addEventListener('click', createElement);
function createElement(){
var textblock = document.getElementById('langertext');
var addition = document.createElement('div');
addition.id = 'plus';
addition.innerText = text;
textblock.appendChild(addition);
}
});
// Funktion zum Entfernen:
function removeit() {
var todel = document.getElementById("plus");
todel.remove();
}
</script>
</head>
<body bgcolor="#ffffff">
<h2> Bitte Knopf drücken </h2>
<button id="knopf">Text hinzufügen</button>
<div id="langertext">
<p>Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen.<br>
Manchmal benutzt man Worte wie Hamburgefonts, Rafgenduks oder Handgloves, um Schriften zu testen. <br>
Manchmal Sätze, die alle Buchstaben des Alphabets enthalten.</p>
</div>
<!-- Knopf zum Entfernen -->
<p>
<button onclick="removeit()">Weg damit</button>
</p>
</body>
</html>
 

basti1012

Senior HTML'ler
26 November 2017
1.687
177
63
Minden
basti1012.de
Und was ist damit?
Läuft doch
Dein HTML ist veraltet, aber sonst läuft es doch.
Beim JS kannst du das onclick noch in ein click eventlistener tauschen , ansonsten kann ich da jetzt nicht mehr zusagen.

EDIT:
Doch muss doch was sagen.
Beim ceateElement benutzt du immer die gleiche Id.
Das ist verboten.
Finde da ein Weg das bei mehreren erstellten Reihen verschiedene Ids erstellt werden, oder über Klassen
 
Zuletzt bearbeitet:
Werbung:

Neueste Beiträge