Heim  >  Artikel  >  Web-Frontend  >  Wie kodiere ich HTML-Entitäten in JavaScript für eine konsistente Anzeige benutzergenerierter Inhalte?

Wie kodiere ich HTML-Entitäten in JavaScript für eine konsistente Anzeige benutzergenerierter Inhalte?

Susan Sarandon
Susan SarandonOriginal
2024-10-31 07:08:30678Durchsuche

How to Encode HTML Entities in JavaScript for Consistent User-Generated Content Display?

HTML-Entitäten in JavaScript kodieren

Bei der Arbeit mit benutzergenerierten Inhalten werden Entitäten wie ®, &, © und ™ möglicherweise nicht angezeigt konsistent in allen Browsern. JavaScript bietet mehrere Methoden zum Codieren dieser Entitäten in HTML.

Konvertieren in HTML-Entitäten

Um ein Symbol in die entsprechende HTML-Entität zu konvertieren, verwenden Sie diesen Code:

<code class="js">var encodedStr = rawStr.replace(/[\u00A0-\u9999<>\&amp;]/g, function(i) {
   return '&amp;#'+i.charCodeAt(0)+';';
});</code>

Anzeige hochgestellt

Um die codierte Entität hochgestellt mit benutzerdefiniertem Stil anzuzeigen, verwenden Sie CSS:

<code class="css">sup {
  font-size: 0.6em;
  padding-top: 0.2em;
}</code>

Beispielimplementierung

<code class="js">var regs = document.querySelectorAll('®');
for (var i = 0, l =regs.length; i < l; ++i ) {
  var div = document.createElement('sup');
  var text = document.createTextNode(encodedStr);
  div.appendChild(text);
  regs[i].parentNode.insertBefore(div);
}</code>

Dieser Code:

  1. Wählt alle Elemente mit dem ®-Symbol aus.
  2. Erstellt ein Sup-Element und fügt es vor dem ausgewählten Element ein.
  3. Hängt die codierte HTML-Entität an das sup-Element an.

Zusätzliche Überlegungen

  • Verwenden Sie UTF8-Zeichenkodierung und Datenbankspeicherung, um Sorgen Sie für eine ordnungsgemäße Anzeige.
  • Browser-Schriftartkonfigurationen können sich dennoch auf das Erscheinungsbild bestimmter Zeichen auswirken.

Dokumentation

  • String.charCodeAt : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
  • HTML-Zeichenentitäten: http://www.chucke.com/entities. html

Das obige ist der detaillierte Inhalt vonWie kodiere ich HTML-Entitäten in JavaScript für eine konsistente Anzeige benutzergenerierter Inhalte?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn