Ratgeber: Einen Programmcode im Artikel als Text statt als ausführbares HTML ausgeben

Winkelklammern können zum erklärten Inhalt gehören

Ein Programmierartikel möchte eine kleine HTML-Zeile zeigen. Wenn die Anwendung den eingefügten Beispieltext als HTML interpretiert, kann statt des Codes ein echtes Seitenelement entstehen. MDN unterscheidet textContent von innerHTML: Die eine Eigenschaft arbeitet mit Textinhalt, die andere mit HTML. Für eine lesbare Codeanzeige ist deshalb zuerst zu entscheiden, ob der übergebene Wert als Text oder als auszuführende Seitenstruktur gedacht ist.

Das Beispiel in einen passenden Textbereich setzen

Verwende für die Darstellung einen geeigneten Bereich, etwa eine verständlich beschriftete Codepassage. Übergib den Beispielinhalt über einen Textweg, wenn er wörtlich gelesen werden soll. Unsere Empfehlung für die Probe ist eine harmlose Zeile mit einem sichtbaren HTML-Tag. Nach dem Einfügen sollten die Winkelklammern im Beispiel erkennbar sein und nicht zu einer neuen Schaltfläche oder Überschrift im Artikel werden.

Die Dokumentation weist darauf hin, dass das Setzen von textContent vorhandene Kindelemente ersetzt. Richte den Zielbereich deshalb bewusst ein. Wenn du den gesamten Artikelcontainer überschreibst, können auch zuvor vorhandene Quellenlinks verschwinden. Die richtige Eigenschaft allein verhindert keine falsche Zielauswahl. Prüfe den Bezug zum konkreten Element und bewahre angrenzende Inhalte außerhalb der ersetzten Codepassage.

Darstellung und Kopie getrennt prüfen

Kontrolliere zuerst die sichtbare Fassung im Browser. Kopiere anschließend das Beispiel in einen einfachen Texteditor und vergleiche die Zeichen. Zeilenumbrüche, Anführungszeichen und Sonderzeichen sollten dem beabsichtigten Beispiel entsprechen. Eine schön gefärbte Syntaxanzeige ist noch kein Beweis für eine unveränderte Kopie. Verwende im Test keine echten Schlüssel oder privaten Zugangsdaten; der technische Darstellungsweg benötigt sie nicht.

Einen Textweg nicht zum Gesamtschutz erklären

Die beschriebene Unterscheidung ist ein wichtiger Baustein für die Ausgabe. Eine Anwendung kann an anderen Stellen weiterhin unsichere HTML-Verarbeitung besitzen. Behaupte deshalb nach einer gelungenen Codeanzeige keine vollständige Sicherheitsprüfung. Dokumentiere den konkreten Eingang, das verwendete Zielelement und die beobachtete Ausgabe. Damit bleibt klar, welcher kleine Inhaltspfad tatsächlich geprüft wurde und welche weiteren Stellen gesondert untersucht werden müssen.