Caracteres de escape en HTML

1. Introducción a los escapes de caracteres en HTML
2. Caracteres que deben escaparse en HTML

En este tutorial, aprenderemos sobre los escapes de caracteres HTML. Además, el tutorial presentará qué caracteres deben escaparse en HTML.

Introducción a los escapes de caracteres en HTML

Usamos escapes de caracteres en lenguajes de marcado como HTML, XML y XHTML para representar los caracteres Unicode usando los caracteres ASCII.

Los escapes de caracteres surgen cuando necesitamos representar caracteres como <, >, utilizados en lenguajes de marcado. Si no evitamos estos caracteres, se interferirán las reglas de marcado y no lograremos el resultado deseado.

Se pueden escapar varios caracteres Unicode en HTML. Algunos de los caracteres que se pueden escapar son ", ', <, >, &, etc.

La lista de entidades HTML se puede encontrar aquí. Estos personajes se pueden representar principalmente de dos formas.

Esas son referencias de caracteres numéricos y referencias de caracteres con nombre. Las referencias de caracteres numéricos se pueden representar como referencias de caracteres numéricos decimales y hexadecimales.

Veamos el siguiente ejemplo, que muestra la representación de un espacio sin interrupción utilizando las diferentes referencias de caracteres.

Código de ejemplo:

<p> Hi Jack&nbsp;! </p> <!-- named character references -->
<p> Hi Jack&#xA0;! </p> <!-- hexadecimal numeric character references -->
<p> Hi Jack&#160;! </p> <!-- decimal numeric character references -->

Producción:

Como se ve en el ejemplo anterior, las referencias de caracteres con nombre, las referencias de caracteres numéricos hexadecimales y las referencias de caracteres numéricos decimales del espacio de no separación son  ,   y  , respectivamente. Podemos notar que las referencias de caracteres numéricos comienzan con los caracteres &# y terminan con ;.

En HTML, hay varios contextos en los que se deben escapar algunos caracteres. Algunos de los contextos son el cuerpo del documento y los atributos internos, las etiquetas de estilo y script, etc.

Caracteres que deben escaparse en HTML

Esta sección discutirá los caracteres que se deben escapar en HTML. No se deben perder tres caracteres para escapar en HTML. Esos son:

• (<)
• (>)
• (&)

Los lenguajes de marcado como HTML y XML constituyen símbolos más grandes y más pequeños, < y >, también llamados tax wrappers. Deberíamos escapar de estos envoltorios de sintaxis en el cuerpo del documento; de lo contrario, se interferirá con la sintaxis de marcado.

La referencia de carácter de nombre del contenedor de sintaxis se muestra a continuación.

• (<) <
• (>) >

Aquí, veremos las condiciones en las que los personajes no se escapan y cómo podemos escapar de los personajes.

En el ejemplo siguiente, en la primera etiqueta <a>, hemos escrito el texto the <a> tag entre las etiquetas <a>.

Como resultado, el hipervínculo se aplica solo al carácter el porque se ha encerrado con dos etiquetas <a>.

Pero, este no es nuestro objetivo. Nuestro objetivo es mostrar solo la etiqueta <a>. Por lo tanto, es necesario escapar de los envoltorios de sintaxis alrededor de la etiqueta a.

Por lo tanto, usamos el < y > referencias de caracteres para escapar de los contenedores de sintaxis. El <a> referencia representa la etiqueta <a>.

Como resultado, en la segunda etiqueta <a> del ejemplo siguiente, se aplica un hipervínculo a todo el texto, the <a> tag. Esta es la razón por la que debemos escapar de los envoltorios de sintaxis en HTML.

Código de ejemplo:

<a href="#"> the <a> tag </a> <br>
<a href="#"> the &lt;a&gt; tag </a> 

Producción:

El símbolo de ampersand se usa como el primer carácter para escribir el carácter de referencia de los caracteres Unicode mientras se escapan los caracteres. Pero, si tenemos que mostrar el carácter de referencia de un carácter Unicode en particular en HTML, debemos escapar el símbolo ampersand.

El ejemplo se muestra a continuación.

Código de ejemplo:

<p> The character reference of the symbol &lt; is &amp;lt; </p>

Producción:

Nuestro objetivo es mostrar el carácter de referencia equivalente del símbolo <, <. Pero cuando escribimos la referencia <, se convierte en < en el navegador.

Para representar el carácter de referencia del nombre, debemos escapar del símbolo de ampersand en la referencia <. Después de escapar el ampersand, podemos escribir los caracteres restantes como de costumbre, como se muestra en el ejemplo anterior.

Este artículo nos enseñó por qué debemos escapar los caracteres y qué caracteres deben escaparse en HTML. También aprendimos sobre las referencias de caracteres de nombre y las referencias de caracteres numéricos.