web-dev-qa-db-fra.com

Supprimer les balises HTML en Javascript avec Regex

J'essaie de supprimer toutes les balises html d'une chaîne en Javascript. Voici ce que j'ai ... Je ne comprends pas pourquoi ça ne marche pas ... Est-ce que quelqu'un sait ce que je fais mal?

<script type="text/javascript">

var regex = "/<(.|\n)*?>/";
var body = "<p>test</p>";
var result = body.replace(regex, "");
alert(result);

</script>

Merci beaucoup!

100
Gabe

Essayez ceci, en notant que la grammaire HTML est trop complexe pour que les expressions régulières soient correctes 100% du temps:

var regex = /(<([^>]+)>)/ig
,   body = "<p>test</p>"
,   result = body.replace(regex, "");

console.log(result);

Si vous êtes prêt à utiliser une bibliothèque telle que jQuery , vous pouvez simplement faire ceci:

console.log($('<p>test</p>').text());
219
karim79

C'est une vieille question, mais je suis tombé sur elle et je pensais partager la méthode que j'ai utilisée:

var body = '<div id="anid">some <a href="link">text</a></div> and some more text';
var temp = document.createElement("div");
temp.innerHTML = body;
var sanitized = temp.textContent || temp.innerText;

désinfecté contiendra maintenant: "some text and some more text"

Simple, pas besoin de jQuery, et il ne devrait pas vous laisser tomber même dans des cas plus complexes :)

James

30
jsdw

Cela a fonctionné pour moi.

   var regex = /(&nbsp;|<([^>]+)>)/ig
      ,   body = tt
     ,   result = body.replace(regex, "");
       alert(result);
7
d689p

Voici comment TextAngular (éditeur WYSISYG) le fait. J'ai aussi trouvé que c'était la réponse la plus cohérente, c'est-à-dire NO REGEX.

@license textAngular
Author : Austin Anderson
License : 2013 MIT
Version 1.5.16
// turn html into pure text that shows visiblity
function stripHtmlToText(html)
{
    var tmp = document.createElement("DIV");
    tmp.innerHTML = html;
    var res = tmp.textContent || tmp.innerText || '';
    res.replace('\u200B', ''); // zero width space
    res = res.trim();
    return res;
}
4
Rentering.com

my simple La bibliothèque JavaScript appelée FuncJS possède une fonction appelée "strip_tags ()" qui effectue la tâche à votre place, sans vous obliger à entrer des expressions régulières.

Par exemple, disons que vous voulez supprimer les balises d'une phrase - avec cette fonction, vous pouvez le faire simplement comme ceci:

strip_tags("This string <em>contains</em> <strong>a lot</strong> of tags!");

Cela produira "Cette chaîne contient beaucoup de tags!".

Pour une meilleure compréhension, veuillez lire la documentation sur GitHub FuncJS .

De plus, si vous le souhaitez, veuillez fournir des commentaires via le formulaire. Ce serait très utile pour moi!

2
Sharikul Islam

vous pouvez utiliser une bibliothèque puissante pour la gestion String qui est ndrescore.string.js

_('a <a href="#">link</a>').stripTags()

=> 'un lien'

_('a <a href="#">link</a><script>alert("hello world!")</script>').stripTags()

=> 'un lien de liaison ("bonjour le monde!")'

N'oubliez pas d'importer cette bibliothèque comme suit:

        <script src="underscore.js" type="text/javascript"></script>
        <script src="underscore.string.js" type="text/javascript"></script>
        <script type="text/javascript"> _.mixin(_.str.exports())</script>
2
Abdennour TOUMI

Pour un désinfectant HTML approprié dans JS, voir http://code.google.com/p/google-caja/wiki/JsHtmlSanitizer

0
Mike Samuel

La réponse sélectionnée ne garantit pas toujours que le code HTML est supprimé, car il est toujours possible de construire une chaîne HTML non valide à travers celle-ci en créant une chaîne comme celle-ci.

  "<<h1>h1>foo<<//</h1>h1/>"

Cette entrée garantira que la suppression assemble un ensemble de balises pour vous et aura pour résultat:

  "<h1>foo</h1>"

de plus, la fonction texte de jquery effacera le texte non entouré de balises.

Voici une fonction qui utilise jQuery mais qui devrait être plus robuste face à ces deux cas:

var stripHTML = function(s) {
    var lastString;

    do {            
        s = $('<div>').html(lastString = s).text();
    } while(lastString !== s) 

    return s;
};
0
Rick Moynihan

La façon dont je le fais est pratiquement un one-liner.

La fonction crée un objet Range , puis crée un DocumentFragment dans Range avec la chaîne en tant que contenu enfant.

Ensuite, il saisit le texte du fragment, supprime tous les caractères "invisibles"/de largeur nulle et le réduit de tout espace blanc au début/à la fin.

Je me rends compte que cette question est ancienne, je pensais juste que ma solution était unique et je voulais la partager. :)

function getTextFromString(htmlString) {
    return document
        .createRange()
        // Creates a fragment and turns the supplied string into HTML nodes
        .createContextualFragment(htmlString)
        // Gets the text from the fragment
        .textContent
        // Removes the Zero-Width Space, Zero-Width Joiner, Zero-Width No-Break Space, Left-To-Right Mark, and Right-To-Left Mark characters
        .replace(/[\u200B-\u200D\uFEFF\u200E\u200F]/g, '')
        // Trims off any extra space on either end of the string
        .trim();
}

var cleanString = getTextFromString('<p>Hello world! I <em>love</em> <strong>JavaScript</strong>!!!</p>');

alert(cleanString);
0
ElijahFowler
<html>
<head>
<script type="text/javascript">
function striptag(){
var html = /(<([^>]+)>)/gi;
for (i=0; i < arguments.length; i++)
arguments[i].value=arguments[i].value.replace(html, "")
}
</script>
</head> 
<body>
       <form name="myform">
<textarea class="comment" title="comment" name=comment rows=4 cols=40></textarea><br>
<input type="button" value="Remove HTML Tags" onClick="striptag(this.form.comment)">
</form>
</body>
</html>
0
Surya R Praveen