in

Codificar entidades HTML en JavaScript

apple touch icon@2

Caracteres especiales HTML y sus ESCAPE CODES

Los caracteres reservados se deben escapar mediante HTML: podemos usar un escape de carácter para representar cualquier carácter Unicode [Ex: & – U+00026] en HTML, XHTML o XML utilizando solo caracteres ASCII. Referencias de caracteres numéricos [Ex: ampersand(&) – &] Y Referencias de personajes nombrados [Ex: &] son tipos de character escape used in markup.


Entidades predefinidas

Personaje original Reemplazo de entidad XML Reemplazo numérico XML
& lt; & # 60;
> & gt; & # 62;
" & quot; & # 34;
Y &erio; & # 38;
' & apos; & # 39;

Para mostrar etiquetas HTML como un formulario normal en la página web usamos <pre>, <code> etiquetas o podemos escapar de ellas. Escapando de la cadena reemplazando con cualquier ocurrencia del "&" personaje por la cadena "&amp;" y cualquier ocurrencia del ">" personaje por la cadena "&gt;". Ex: stackoverflow post

function escapeCharEntities() {
    var map = {
        "&": "&amp;",
        "<": "&lt;",
        ">": "&gt;",
        """: "&quot;",
        "'": "&apos;"
    };
    return map;
}

var mapkeys="", mapvalues="";
var html = {
    encodeRex : function () {
        return  new RegExp(mapkeys, 'g'); // "[&<>"']"
    }, 
    decodeRex : function () {
        return  new RegExp(mapvalues, 'g'); // "(&amp;|&lt;|&gt;|&quot;|&apos;)"
    },
    encodeMap : JSON.parse( JSON.stringify( escapeCharEntities () ) ), // json = {&: "&amp;", <: "&lt;", >: "&gt;", ": "&quot;", ': "&apos;"}
    decodeMap : JSON.parse( JSON.stringify( swapJsonKeyValues( escapeCharEntities () ) ) ),
    encode : function ( str ) {
        var encodeRexs = html.encodeRex();
        console.log('Encode Rex: ', encodeRexs); // /[&<>"']/gm
        return str.replace(encodeRexs, function(m) { console.log('Encode M: ', m); return html.encodeMap[m]; }); // m = < " > SpecialChars
    },
    decode : function ( str ) {
        var decodeRexs = html.decodeRex();
        console.log('Decode Rex: ', decodeRexs); // /(&amp;|&lt;|&gt;|&quot;|&apos;)/g
        return str.replace(decodeRexs, function(m) { console.log('Decode M: ', m); return html.decodeMap[m]; }); // m = &lt; &quot; &gt;
    }
};

function swapJsonKeyValues ( json ) {
    var count = Object.keys( json ).length;
    var obj = {};
    var keys="[", val="(", keysCount = 1;
    for(var key in json) {
        if ( json.hasOwnProperty( key ) ) {
            obj[ json[ key ] ] = key;
            keys += key;
            if( keysCount < count ) {
                val += json[ key ]+'|';
            } else {
                val += json[ key ];
            }
            keysCount++;
        }
    }
    keys += ']';    val  += ')';
    console.log( keys, ' == ', val);
    mapkeys = keys;
    mapvalues = val;
    return obj;
}

console.log('Encode: ', html.encode('<input type="password" name="password" value=""/>') ); 
console.log('Decode: ', html.decode(html.encode('<input type="password" name="password" value=""/>')) );

O/P:
Encode:  &lt;input type=&quot;password&quot; name=&quot;password&quot; value=&quot;&quot;/&gt;
Decode:  <input type="password" name="password" value=""/>

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

problem solutions

Python – Diseño de algoritmos

gfg 200x200 min

¿Cómo imprimir sin nueva línea en Python?