Signatur
Beschreibung
Mit setComments() änderst du die Konfiguration einer bestehenden Sanitizer-Instanz: Übergibst du true, bleiben HTML-Kommentare im bereinigten Markup erhalten. Bei false werden sie entfernt. Die Methode ändert die Instanz direkt, du musst also keinen neuen Sanitizer anlegen.
Kommentare sind für die Darstellung im Browser bedeutungslos. Sie können aber interne Hinweise, Build-Informationen oder Marker von Template-Systemen enthalten, etwa <!--more--> in CMS-Inhalten oder Hydration-Marker. Diese Informationen willst du dem Endnutzer oft nicht ausliefern. Wenn nachgelagerter Code solche Marker aber auswertet, musst du sie ausdrücklich erlauben.
Der konfigurierte Sanitizer wird anschließend an Methoden wie Element.setHTML(), ShadowRoot.setHTML() oder Document.parseHTML() übergeben (Option { sanitizer }). Die aktuelle Einstellung liest du über sanitizer.get().comments aus.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $allow Pflicht | boolean | true lässt Kommentare im Ergebnis stehen, false entfernt sie. |
Beispiele
Kommentare aus Nutzerinhalten entfernen
const sanitizer = new Sanitizer();
sanitizer.setComments(false);
const box = document.createElement('div');
box.setHTML('<p>Hallo<!-- interne Notiz --> Welt</p>', { sanitizer });
console.log(box.innerHTML);
CMS-Marker wie <!--more--> erhalten
const sanitizer = new Sanitizer();
sanitizer.setComments(true);
const article = document.querySelector('#artikel');
article.setHTML('<p>Anreißer</p><!--more--><p>Volltext</p>', { sanitizer });
// Marker für die „Weiterlesen“-Logik finden
const walker = document.createTreeWalker(article, NodeFilter.SHOW_COMMENT);
console.log(walker.nextNode()?.data);
Rückgabewert und aktuelle Konfiguration prüfen
const sanitizer = new Sanitizer();
console.log(sanitizer.setComments(true)); // Wert wird geändert
console.log(sanitizer.setComments(true)); // war schon gesetzt
console.log(sanitizer.get().comments);
Mit Feature-Erkennung und Fallback
const renderSafe = (el, html) => {
if ('Sanitizer' in window && 'setHTML' in Element.prototype) {
const sanitizer = new Sanitizer();
sanitizer.setComments(false);
el.setHTML(html, { sanitizer });
} else {
// Fallback: nur Text ausgeben, kein HTML interpretieren
el.textContent = html;
}
};
renderSafe(document.body, '<b>Fett</b><!-- geheim -->');
// Wichtig · Fallstricke
- Experimentelle API: Die Sanitizer API ist noch nicht in allen Browsern verfügbar. In manchen ist sie nur hinter einem Flag aktiv. Frühere Entwürfe hatten eine andere Form, zum Beispiel
sanitizer.sanitize()undallowCommentsim Konstruktor. Prüfe deshalb immer mit Feature-Erkennung ('Sanitizer' in window) und plane einen Fallback ein, etwa DOMPurify. - Kein Sicherheitsgewinn durch Kommentare: Erlaubte Kommentare führen keinen Skriptcode aus. Allerdings verraten sie möglicherweise interne Informationen. Außerdem kann Code, der Kommentarinhalte später per
innerHTMLwieder einfügt, neue XSS-Lücken öffnen. - Nur bei sicheren Methoden wirksam:
setHTML()entfernt gefährliche Elemente wie<script>auch dann, wenn die Konfiguration sie erlaubt.setHTMLUnsafe()tut das nicht, egal wiesetComments()eingestellt ist. - Die Methode ändert die Instanz direkt. Wenn mehrere Programmteile denselben Sanitizer verwenden, betrifft die Änderung alle.
- Ob Kommentare standardmäßig erlaubt sind, hängt davon ab, wie der Sanitizer erzeugt wurde (Standardkonfiguration oder eigenes Konfigurationsobjekt). Setze den Wert daher ausdrücklich, wenn es darauf ankommt.