Cómo decodificar entidades HTML usando JavaScript

HTML almacena sus personajes reservados como entidades de personaje. Las entidades de caracteres son cadenas de texto simples que comienzan con un y y terminan con A;. Las entidades HTML son necesarias porque si está tratando de escribir los caracteres especiales de HTML como texto simple, entonces HTML debería poder almacenarlos de alguna manera para que no se interpreten como código HTML. Las entidades HTML son necesarias para la visualización adecuada de la representación de texto en páginas web. Las entidades también se pueden usar al intentar escribir caracteres que generalmente no se encuentran en los teclados estándar.

Entidades HTML decodificantes

Las entidades HTML se pueden decodificar utilizando varios métodos diferentes que involucran a las bibliotecas de Vanilla JavaScript o JavaScript. Esta guía solo pasará por los métodos JavaScript de vainilla para decodificar entidades HTML, ya que son fáciles y directas.

Decodificación de entidades HTML con el elemento DOM

El primer método es utilizando el elemento TextAREA. Como su nombre indica, el elemento TextAREA se usa para crear un área de texto simple donde cada carácter se interpreta como texto simple.:

función decode (str)
Dejar txt = documento.CreateElement ("TextArea");
TXT.innerhtml = str;
devolver txt.valor;

En el código anterior, primero creamos el elemento TextAREA usando el documento.método createElement (). Luego escribimos la cadena que contiene entidades HTML dentro de la textura utilizando la propiedad innerhtml. De esta manera, la cadena se convertirá en texto simple y las entidades se convertirán en caracteres. Por último, devolvimos la cadena almacenada dentro de la variable TXT, que es el TextAREA.

Ahora, si llamamos a la función de decodificación con una entidad HTML como parámetro, la devolverá como texto simple:

Dejar encodedstr = "

";
Let DecodedStr = Decode (EncodedStr);
consola.log (decodedstr);

Decodificación de entidades HTML con el Domparser.método parseFromString ()

El segundo método es utilizando el domparser.método parseFromString (). El domparser.El método parseFromString () toma una cadena que contiene HTML y la devuelve como un elemento HTML:

función decode (str)
Let txt = new DomParser ().parseFromString (str, "texto/html");
devolver txt.documento.contenido del texto;

En el código anterior, primero pasamos la cadena como argumento al DomParser.El método parseFromString () y lo recuperó como un elemento HTML especificando el segundo argumento como "Texto/HTML". Luego devolvimos el contenido de texto del elemento HTML recién creado.

Ahora llamando a la función decode ():

Dejar encodedstr = "

";
Let DecodedStr = Decode (EncodedStr);
consola.log (decodedstr);

Conclusión

Las entidades HTML son necesarias para la visualización adecuada del texto en las páginas web. Algunos sitios web contienen fragmentos de código como texto simple. Sin entidades sería difícil diferenciar entre lo que es un código HTML para la página web y lo que es solo texto sin formato.