Start · Sprachen · JavaScript · Referenz · Document.clear()

Document.clear()

Methode

Die veraltete Methode <code>document.clear()</code> tut nichts und wirft keinen Fehler. Sie existiert nur noch aus Gründen der Abwärtskompatibilität.

seit JavaScript Veraltet (deprecated) – in allen Browsern als No-o deprecated seit ja Kategorie: webapi

Signatur

Document.prototype.clear()

Beschreibung

Die Methode document.clear() stammt aus frühen Browser-Zeiten. Damals sollte sie den Inhalt eines Dokuments leeren, meist in Verbindung mit document.open() und document.write(). Im heutigen HTML-Standard ist sie als veraltet markiert und als leere Operation (No-op) festgelegt. Ein Aufruf verändert also weder das DOM noch die Darstellung.

Die Methode gibt es nur noch, damit alte Skripte, die sie aufrufen, nicht mit einem TypeError abbrechen. In neuem Code sollte man sie nie verwenden, denn sie hat keinerlei Wirkung.

Wer ein Dokument oder einen Bereich wirklich leeren will, greift zu modernen DOM-Methoden. Beispiele sind element.replaceChildren(), das Setzen von textContent = "" oder das Entfernen einzelner Knoten mit Node.removeChild() bzw. Element.remove().

Rückgabewert

Typ
undefined
Beschreibung
Kein Rückgabewert. Die Methode liefert immer undefined und hat keine Nebenwirkungen.

Beispiele

Aufruf zeigt keine Wirkung

// Anzahl der Body-Kindknoten vor und nach dem Aufruf vergleichen
const before = document.body.childNodes.length;
const result = document.clear();
const after = document.body.childNodes.length;

console.log(result);            // undefined
console.log(before === after);  // true – nichts wurde entfernt
undefined true

Moderner Ersatz: Body-Inhalt wirklich leeren

// Statt document.clear() – entfernt alle Kindknoten des <body>
const resetPage = () => {
  document.body.replaceChildren();
};

resetPage();
console.log(document.body.childNodes.length);

Einen Container leeren und neu befüllen

const list = document.createElement('ul');
list.innerHTML = '<li>Alt 1</li><li>Alt 2</li>';
document.body.append(list);

// Alten Inhalt ersetzen – so macht man es heute
const items = ['Neu A', 'Neu B', 'Neu C'].map((text) => {
  const li = document.createElement('li');
  li.textContent = text;
  return li;
});
list.replaceChildren(...items);

console.log(list.children.length);
3

Altcode absichern: Existenz prüfen

// Legacy-Code, der clear() aufruft, bricht nicht ab –
// eine Prüfung schadet trotzdem nicht
if (typeof document.clear === 'function') {
  document.clear(); // No-op
}
console.log('Skript läuft weiter');
Skript läuft weiter

// Wichtig · Fallstricke

  • Veraltet: Der HTML-Standard legt fest, dass die Methode nichts tut. Wer sich darauf verlässt, dass sie Inhalte löscht, hat einen stillen Fehler im Code, denn es gibt keine Fehlermeldung.
  • Kompatibilität: Alle aktuellen Browser (Chrome, Firefox, Safari, Edge) stellen die Methode als No-op bereit. Unter Node.js gibt es kein document. Umgebungen wie jsdom bilden die Methode eventuell nicht nach.
  • Nicht mit document.open() verwechseln: document.open() leert das Dokument tatsächlich und kann bei falschem Einsatz die ganze Seite zerstören.
  • Als Ersatz dienen replaceChildren() oder textContent = "". Bei großen Bäumen sind sie schneller und sicherer als innerHTML = "".
  • Namensgleiche Methoden wie Map.prototype.clear(), Set.prototype.clear() oder Storage.clear() funktionieren tatsächlich. Sie haben mit document.clear() nichts zu tun.