Maison >interface Web >js tutoriel >Comment supprimer efficacement les balises HTML du texte à l'aide de JavaScript simple ?

Comment supprimer efficacement les balises HTML du texte à l'aide de JavaScript simple ?

Linda Hamilton
Linda Hamiltonoriginal
2024-12-27 07:11:13594parcourir

How to Efficiently Remove HTML Tags from Text Using Plain JavaScript?

Supprimer les balises HTML du texte en JavaScript brut

Supprimer les balises HTML d'une chaîne est une tâche courante dans le développement Web. Bien qu'il existe des bibliothèques disponibles à cet effet, il est possible d'y parvenir en utilisant du JavaScript simple.

Utilisation du DOM du navigateur

Si votre code s'exécute dans un navigateur, le plus simple L'approche consiste à laisser le navigateur gérer l'analyse HTML. Cela peut être fait en créant un élément DOM temporaire et en définissant sa propriété innerHTML sur la chaîne HTML. La propriété textContent ou innerText résultante contiendra le texte sans balises HTML.

function stripHtml(html) {
   let tmp = document.createElement("DIV");
   tmp.innerHTML = html;
   return tmp.textContent || tmp.innerText || "";
}

Attention : Cette méthode doit être utilisée avec prudence lors du traitement d'entrées non fiables, telles que du contenu généré par l'utilisateur.

Utiliser DOMParser

Une méthode alternative consiste à utiliser le Interface DOMParser, disponible dans les navigateurs modernes. Cela vous permet d'analyser des chaînes HTML sans créer d'éléments DOM.

function stripHtml(html) {
   const doc = new DOMParser().parseFromString(html, "text/html");
   return doc.body.textContent;
}

Expressions régulières

Les expressions régulières peuvent également être utilisées pour supprimer les balises HTML d'une chaîne, mais cette approche est généralement moins efficace et robuste que les méthodes ci-dessus.

function stripHtml(html) {
   return html.replace(/<.+?>/g, "");
}

N'oubliez pas de prendre en compte les limites et les implications de sécurité de chaque méthode lorsque choisir la solution appropriée à votre cas d'utilisation.

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!

Déclaration:
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