Bearbeiten einer Aufgabe in der Checkliste mit JavaScript

Lassen Sie uns nun die Bearbeitung implementieren. Dazu fügen wir dem span mit dem Text einen Doppelklick hinzu:

javascriptlet task = document.createElement('span');
task.classList.add('task');
task.textContent = this.value;
task.addEventListener('dblclick', function() {
  // hier wird der Code zur Implementierung der Bearbeitung stehen
});
li.appendChild(task);

Bei einem Doppelklick auf das angegebene span müssen wir darin ein Input-Feld mit dem Text dieses span erstellen. Dann, nach dem Drücken der Enter-Taste in diesem Input-Feld, müssen wir den Text dieses Input-Felds zurück in unser Span-Element schreiben und das Input-Feld selbst entfernen.