HTML-Reiniger: Attribute, Skripte und Ballast online entfernen
Füge unübersichtliches HTML ein und erhalte ein sauberes, attributfreies Gerüst sowie eine JSON-Übersicht der Struktur; Skripte, Styles, Kommentare, SVG, Formulare und eigene Selektoren werden entfernt.
Läuft vollständig mit dem nativen HTML-Parser in deinem Browser; nichts wird hochgeladen. Ideal für Inhaltsextraktion, Scraping-Pipelines, CMS-Migrationen und HTML für LLM-Eingaben.
HTML-Reiniger: Attribute, Skripte und Ballast online entfernen
Füge unübersichtliches HTML ein und erhalte ein sauberes, attributfreies Gerüst sowie eine JSON-Übersicht der Struktur; Skripte, Styles, Kommentare, SVG, Formulare und eigene Selektoren werden entfernt.
Über den HTML-Reiniger
HTML von echten Websites bringt enorme Mengen Ballast mit: Framework-Klassen, Inline-Styles, data-*-Attribute, Tracking-Skripte, SVG-Symbole, Kommentar-Markierungen und Ebenen von div-Wrappern für einzelne Zwecke. Wenn du eigentlich nur die Inhaltsstruktur brauchst – für eine Scraping-Pipeline, eine CMS-Migration, einen Vergleich oder zum Kürzen einer Seite vor der Übergabe an ein Sprachmodell – ist all das Rauschen, das die wichtigen Signale verdeckt und Tokens verschwendet.
Dieses Tool analysiert dein HTML mit dem browsereigenen Parser (DOMParser) und führt eine konfigurierbare Bereinigung durch: Alle Attribute werden entfernt (optional bleibt href in Links für den Linkgraph erhalten), script-, style-, Kommentar-, SVG- und Formular-Knoten werden gelöscht, Elemente passend zu eigenen CSS-Selektoren werden entfernt (einer pro Zeile – praktisch für Navigationen oder Cookie-Banner), leere übrig gebliebene Tags werden bereinigt und optional jeder Wrapper mit genau einem Kind und ohne eigenen Text aufgelöst, wodurch div-Verschachtelungen zusammenfallen.
Es entstehen zwei Ausgaben nebeneinander: das bereinigte HTML und eine JSON-Übersicht der verbleibenden Struktur (tag, text, children, href), die sich gut programmgesteuert verarbeiten lässt. Das Größen-Badge zeigt die Reduktion; bei typischen modernen Seiten ist das bereinigte Gerüst 80-95% kleiner als die Eingabe. Alles läuft lokal in deinem Browser-Tab – das HTML verlässt dein Gerät nie.
Beispiele für HTML-Bereinigung
Was jede Option mit einem Ausschnitt macht.
| Eingabe | Ausgabe | Hinweise |
|---|---|---|
| ⟨div class="a b c" data-x="1"⟩⟨p style="color:red"⟩Hi⟨/p⟩⟨/div⟩ | ⟨div⟩⟨p⟩Hi⟨/p⟩⟨/div⟩ | Alle Attribute entfernt; Struktur und Text bleiben erhalten. |
| ⟨p⟩Text⟨script⟩evil()⟨/script⟩⟨/p⟩ | ⟨p⟩Text⟨/p⟩ | script-Tags werden vollständig entfernt. |
| ⟨a class="btn" href="/docs"⟩Docs⟨/a⟩ | ⟨a href="/docs"⟩Docs⟨/a⟩ | Mit aktiviertem „href behalten“ bleiben Links nutzbar. |
| ⟨div⟩⟨div⟩⟨p⟩Deep⟨/p⟩⟨/div⟩⟨/div⟩ | ⟨p⟩Deep⟨/p⟩ | „Wrapper mit einem Kind auflösen“ reduziert reine Verschachtelungen. |
So verwendest du den HTML-Reiniger
- Füge das HTML in das Eingabefeld ein.
- Wähle die gewünschten Bereinigungsoptionen; füge für Elemente wie Navigationsleisten oder Werbeblöcke eigene CSS-Selektoren hinzu, einen pro Zeile.
- Klicke auf „HTML bereinigen“.
- Kopiere das bereinigte HTML oder die JSON-Struktur zur programmatischen Verarbeitung.
- Das Größen-Badge zeigt, wie viel Ballast entfernt wurde.
FAQ zum HTML-Reiniger
Wird mein HTML auf einen Server hochgeladen?
Nein. Analyse und Bereinigung laufen vollständig mit DOMParser in deinem Browser. Nach dem Laden funktioniert die Seite auch offline.
Was bewirken eigene Selektoren?
Jedes Element, das zu einem deiner CSS-Selektoren passt (einer pro Zeile), wird vor der Bereinigung entfernt – etwa „nav“, „#sidebar“ oder „div[class*=ads]“. Ungültige Selektoren werden übersprungen.
Wofür ist die JSON-Ausgabe gedacht?
Sie bildet die bereinigte Struktur als Objekte mit tag, text, children und optional href ab. Das ist praktisch für Scraper, Tests oder strukturierte Inhalte, ohne HTML erneut parsen zu müssen.
Was bedeutet „Wrapper mit einem Kind auflösen“?
Enthält ein Element genau ein Kindelement und keinen eigenen Text, wird der Wrapper entfernt und das Kind nimmt seinen Platz ein. Rekursiv angewendet reduziert dies die tiefen div-Verschachtelungen moderner Websites.
Warum HTML vor der Übergabe an ein LLM bereinigen?
Klassennamen, Inline-Styles und Skripte verbrauchen Tokens, ohne Bedeutung hinzuzufügen. Das bereinigte Gerüst ist meist 80-95% kleiner, senkt Kosten und lässt dem Modell mehr Raum für die Inhalte.
Bleiben Bilder und Zeilenumbrüche erhalten?
Beim Entfernen leerer Tags bleiben br- und img-Elemente ausdrücklich erhalten, auch ohne Kinder, da sie selbst Bedeutung tragen.