Comment encoder des entités HTML en JavaScript pour un affichage cohérent du contenu généré par l'utilisateur ?

Encoder les entités HTML en JavaScript

Lorsque vous travaillez avec du contenu généré par l'utilisateur, les entités telles que ®, &, © et ™ peuvent ne pas s'afficher de manière cohérente sur tous les navigateurs. JavaScript fournit plusieurs méthodes pour encoder ces entités en HTML.

Conversion en entités HTML

Pour convertir un symbole en son entité HTML correspondante, utilisez ce code :

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

Affichage en exposant

Pour afficher l'entité codée en exposant avec un style personnalisé, utilisez CSS :

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

Exemple d'implémentation

<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>

Ce code :

1. Sélectionne tous les éléments avec le symbole ®.
2. Crée un élément sup et l'ajoute avant l'élément sélectionné.
3. Ajoute l'entité HTML codée à l'élément sup.

Considérations supplémentaires

• Utilisez le codage de caractères UTF8 et le stockage de base de données pour garantir un affichage correct.
• Les configurations de polices du navigateur peuvent encore affecter l'apparence de certains caractères.

Documentation

• String.charCodeAt : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
• Entités de caractères HTML : http://www.chucke.com/entities. html

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!