Comment puis-je échapper à certains html en javascript ?

Question

Compte tenu du texte

<b>This is some text</b>

Je veux l'écrire sur ma page pour qu'elle apparaisse comme ceci :

<b>This is some text</b>

et pas comme ça

Voici du texte

en utilisant escape("<b>This is some text</b>") me donne ce joli bijou dans firefox

%3Cb%3EThis%20is%20some%20text%3C/b%3E

pas exactement ce que je cherche. Vous avez des idées ?

Answer 1

Voici une fonction qui remplace les crochets d'angle par leurs entités html. Vous pouvez l'étendre à d'autres caractères.

function htmlEntities( html ) {
    html = html.replace( /[<>]/g, function( match ) {
        if( match === '<' ) return '&lt;';
        else return '&gt;';
    });
    return html;
}

console.log( htmlEntities( '<b>replaced</b>' ) ); // &lt;b&gt;replaced&lt;/b&gt;

Answer 2

Vous pouvez coder tous les caractères de votre chaîne :

function encode(e){return e.replace(/[^]/g,function(e){return"&#"+e.charCodeAt(0)+";"})}

Ou alors, il suffit de cibler les caractères principaux dont il faut se préoccuper (&, points de suspension, <, >, " et ') :

function encode(r){
return r.replace(/[\x26\x0A\<>'"]/g,function(r){return"&#"+r.charCodeAt(0)+";"})
}

test.value=encode('Encode HTML entities!\n\n"Safe" escape <script id=\'\'> & useful in <pre> tags!');

testing.innerHTML=test.value;

/*************
* \x26 is &ampersand (it has to be first),
* \x0A is newline,
*************/

<textarea id=test rows="9" cols="55"></textarea>

<div id="testing">www.WHAK.com</div>

Answer 3

J'utilise la fonction suivante qui échappe tous les caractères avec la balise &# nnn ; sauf pour la notation a-z A-Z 0-9 y espace

function Escape( s )
{
    var h,
        i,
        n,
        c;

    n = s.length;
    h = '';

    for( i = 0; i < n; i++ )
    {
        c = s.charCodeAt( i );
        if( ( c >= 48 && c <= 57 ) 
          ||( c >= 65 && c <= 90 ) 
          ||( c >= 97 && c <=122 )
          ||( c == 32 ) )
        {
            h += String.fromCharCode( c );
        }
        else
        {
            h += '&#' + c + ';';
        }
    }

    return h;
}

Exemple :

Escape('<b>This is some text</b>')

renvoie à

<b>This is some text</b>

La fonction est une preuve d'attaques par injection de code, une preuve d'unicode, du pur JavaScript.

Cette approche est environ 50 fois plus lent que celle qui crée le noeud de texte DOM, mais la fonction échappe une chaîne de un million (1 000 000) de caractères en 100-150 millisecondes.

(Testé sur MacBook Pro début 2011 - Safari 9 - Mavericks)