Home / Questions / 35796
Accepted
Ivxn
Asked: 2020-11-25 11:47:22 +0800 CST 2020-11-25 11:47:22 +0800 CST

Decode HTML entities Ñ and &

  • 772

I am using the JQuery autocomplete library. Currently I have a function that decodes HTML entities of type numeric -> Ñ, but what I don't know is how to integrate entities of this type -> into the function &.

My function:

function decodificarEntidadesHTMLNumericas(texto) {
    return texto.replace(/&#(\d{1,8});/g, function(m, ascii) {
        return String.fromCharCode(ascii);
    });
}

I don't know how to integrate the regular expression so that it decodes both cases.

javascript

3 Answers

  1. Best Answer

    It can be done in 2 ways:

    1. Using the DOM , and creating a textarea that we use for the browser to take care of everything. It has the advantage that it allows decoding all cases:

      function decodificarEntidadesHTML(html) {
    var texto = document.createElement("textarea");
    texto.innerHTML = html;
    return texto.value;
}


      Or, the same code, but avoiding creating the textarea over and over again:

      decodificarEntidadesHTML = (function(html) {
    var texto;
    return function(html){
        texto = texto || document.createElement("textarea");
        texto.innerHTML = html;
        return texto.value;
    }
})();


    1. Edit the function only to replace the cases that interest you. It has the advantage that it is done directly with a function, it does not need to be executed in a browser, and it avoids creating elements in the DOM. As a disadvantage, that it does not cover all cases, or that it would be tedious to incorporate the complete list of entities in the function:

      function decodificarEntidadesHTML(texto) {
    return texto.replace(/&(?:#(?:(\d{1,8})|x([a-z0-9]{1,8}))|(\w+));/gi, function(m, ascii, hex, entidad) {
        if (entidad) {
            switch (entidad) {
                case "amp":
                    return "&";
                case "aacute":
                    return "á";
                //agregar otros...
                default:
                    return "&" + entidad + ";";
            }
        } else {
            var dec = parseInt(ascii,10) || parseInt(hex,16);
            return String.fromCharCode(dec);
        }
    });
}
    • 5

  2. Using jQuery:

    function decodificarEntidadesHTML (texto) {
  return $('<textarea \>').html(texto).text();
}

    Usage example:

    function decodificarEntidadesHTML (texto) {
  return $('<textarea \>').html(texto).text();
}

// 
$('#entrada').val('Bonnie<b>&amp;</b>Cliet');

$('#traducir').on('click', function(){
  var resultado = decodificarEntidadesHTML($('#entrada').val());
  $('#resultado').text(resultado);
});
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Traducir: <textarea id="entrada"></textarea><br/>
<button type="button" id="traducir">Traducir</button><br/>
Traducción: <div id="resultado" style="display: inline"></div>

    • 4

  3. Answer taken from https://stackoverflow.com/a/3700369/1845602

     function decode(str) {
   var elem = document.createElement('textarea');
   elem.innerHTML = str;
   return elem.value;
 }
 console.log(decode("&amp;&#209;"))

    They recommend using a textarea instead of a div to mitigate XSS vulnerabilities.

    • 4