Signatur
Beschreibung
blink() gehört zu den sogenannten HTML-Wrapper-Methoden von String. Die Methode baut lediglich eine Zeichenkette zusammen: "Text".blink() ergibt "<blink>Text</blink>". Das DOM wird nicht verändert, es findet auch kein Escaping statt.
Das Element <blink> war nie Teil eines HTML-Standards. Netscape hat es eingeführt, und alte Browser ließen den Text damit blinken. In allen aktuellen Browsern hat das Element keine Wirkung: Es wird als unbekanntes Element (HTMLUnknownElement) behandelt und der Text erscheint ganz normal.
Die Methode ist nur in Annex B der ECMAScript-Spezifikation festgelegt, also bei den Altlasten, die aus Gründen der Web-Kompatibilität bestehen bleiben. Neuer Code sollte sie nicht verwenden. Einen Blink-Effekt erzeugt man heute mit einer CSS-Animation, und Elemente legt man sicher mit document.createElement() an.
Rückgabewert
<blink>str</blink>. Dabei ist str der ursprüngliche String, der unverändert und ohne Escaping übernommen wird.Beispiele
Einfacher Aufruf
const hinweis = 'Neu!';
console.log(hinweis.blink());
Kein Escaping: gefährlich bei Benutzereingaben
const eingabe = '<img src=x onerror="alert(1)">';
// blink() übernimmt die Eingabe ungeprüft – XSS-Risiko bei innerHTML!
console.log(eingabe.blink());
Moderne Alternative: DOM-API und CSS-Animation
// CSS einmalig einfügen
const style = document.createElement('style');
style.textContent = `
@keyframes blinken { 50% { opacity: 0; } }
.blinkt { animation: blinken 1s step-start infinite; }
@media (prefers-reduced-motion: reduce) { .blinkt { animation: none; } }
`;
document.head.append(style);
const span = document.createElement('span');
span.className = 'blinkt';
span.textContent = 'Neu!'; // textContent escapt automatisch
document.body.append(span);
console.log(span.outerHTML);
// Wichtig · Fallstricke
- Veraltet: Die Methode steht nur in Annex B der Spezifikation. Die Browser unterstützen sie zwar noch überall, das Element
<blink>zeigt aber seit Jahren keinen Effekt mehr (Firefox hat das Blinken ab Version 23 entfernt, Chrome, Safari und Edge haben es nie unterstützt). - Sicherheit: Der Text wird nicht escapt. Wer das Ergebnis mit Benutzereingaben per
innerHTMLeinfügt, öffnet XSS-Lücken. StattdessentextContentodercreateElement()verwenden. - Barrierefreiheit: Blinkende Inhalte können Menschen mit Epilepsie schaden und verstoßen gegen WCAG 2.2.2. Wer trotzdem animiert, sollte
prefers-reduced-motionbeachten. - Wird die Methode auf
nulloderundefinedaufgerufen (etwa übercall), wirft sie einenTypeError.