Maison > interface Web > js tutoriel > Comment puis-je échapper aux caractères spéciaux HTML en JavaScript ?

Comment puis-je échapper aux caractères spéciaux HTML en JavaScript ?

DDD
Libérer: 2024-12-06 01:40:10
original
346 Les gens l'ont consulté

How Do I Escape HTML Special Characters in JavaScript?

Échapper aux caractères spéciaux HTML en JavaScript

Lors de l'affichage de texte en HTML à l'aide de fonctions JavaScript, il est crucial d'échapper aux caractères spéciaux HTML pour éviter les erreurs et comportement inattendu. Les caractères spéciaux dont vous avez besoin pour échapper incluent & (esperluette), < (inférieur à), > (supérieur à), " (guillemet double) et ' (guillemet simple).

Échapper aux caractères spéciaux HTML à l'aide d'une fonction

Heureusement, JavaScript offre un moyen simple pour échapper ces caractères spéciaux à l'aide de la fonction suivante :

function escapeHtml(unsafe) {
  return unsafe
    .replace(/&amp;/g, "&amp;amp;")
    .replace(/</g, "&amp;lt;")
    .replace(/>/g, "&amp;gt;")
    .replace(/&quot;/g, "&amp;quot;")
    .replace(/'/g, "&amp;#039;");
}
Copier après la connexion

Cette fonction prend une chaîne non sécurisée en entrée et renvoie une chaîne échappée en remplaçant toutes les instances de caractères spéciaux HTML avec leurs équivalents échappés.

Échapper aux caractères spéciaux HTML dans les navigateurs modernes

Pour les navigateurs Web modernes prenant en charge la méthode replaceAll, vous pouvez utiliser une version simplifiée de la fonction d'échappement :

const escapeHtml = (unsafe) => {
  return unsafe
    .replaceAll("&amp;", "&amp;amp;")
    .replaceAll("<", "&amp;lt;")
    .replaceAll(">", "&amp;gt;")
    .replaceAll("&quot;", "&amp;quot;")
    .replaceAll("'", "&amp;#039;");
};
Copier après la connexion

En utilisant ces fonctions, vous pouvez afficher en toute sécurité les caractères spéciaux HTML dans vos fonctions JavaScript, garantissant ainsi que votre contenu s'affiche correctement et sans aucun problème de sécurité.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal