sintaxis - ¿Son válidas las etiquetas de cierre automático(no nulas) en HTML5?

la etiqueta html indica al navegador el fin de la página o cierre

Question

Al validador W3C no le gustan las etiquetas de cierre automático (las que terminan con " /> ") en non-void elementos non-void . (Los elementos vacíos son aquellos que pueden no contener ningún contenido). ¿Siguen siendo válidos en HTML5?

Algunos ejemplos de elementos vacíos aceptados :

<br />
<img src="" />
<input type="text" name="username" />

Algunos ejemplos de elementos no nulos rechazados :

<div id="myDiv" />
<span id="mySpan" />
<textarea id="someTextMessage" />

Nota: el validador W3C en realidad acepta etiquetas de cierre automático nulas: el autor originalmente tuvo un problema debido a un simple error tipográfico ( /> lugar de /> ). Sin embargo, las etiquetas de cierre automático no son 100% válidas en HTML5 en general, y las respuestas se basan en el tema de las etiquetas de cierre automático en varios tipos de HTML.

Answer 1

Básicamente, HTML5 se comporta como si la barra diagonal final no estuviera allí. No existe tal cosa como una etiqueta de cierre automático en la sintaxis HTML5.

• Las etiquetas de cierre automático en elementos no vacíos como <p/> , <div/> no funcionarán en absoluto. La barra diagonal final se ignorará, y se tratarán como etiquetas de apertura. Esto puede conducir a problemas de anidación.

  Esto es cierto independientemente de si hay espacios en blanco delante de la barra: <p /> y <div /> tampoco funcionarán por el mismo motivo.

• Las etiquetas de cierre automático en elementos vacíos como <br/> o <img src="" alt=""/> funcionarán, pero solo porque la barra diagonal final se ignora y, en este caso, resulta en el comportamiento correcto.

El resultado es que todo lo que funcionó en su antiguo "XHTML 1.0 servido como texto / html" continuará funcionando como lo hacía antes: tampoco se aceptaron barras diagonales en etiquetas no nulas mientras que la barra diagonal final en elementos nulos funcionó.

Una nota más: es posible representar un documento HTML5 como XML, y esto a veces se denomina "XHTML 5.0". En este caso, las reglas de XML se aplican y las etiquetas de cierre automático siempre se manejarán. Siempre debería ser servido con un tipo de mime XML.

Answer 2

Como señaló Nikita Skvortsov, una división de cierre automático no se validará. Esto se debe a que div es un elemento normal , no un elemento vacío . De acuerdo con la especificación HTML5 , las etiquetas que no pueden tener ningún contenido (conocidas como elementos nulos ) pueden cerrarse automáticamente *. Esto incluye las siguientes etiquetas:

area, base, br, col, embed, hr, img, input, 
keygen, link, meta, param, source, track, wbr

Sin embargo, la "/" es completamente opcional en las etiquetas anteriores, por lo que <img/> no es diferente de <img> , pero <img></img> no es válido.

* Nota: los elementos extraños también pueden ser de cierre automático, pero no creo que esté dentro del alcance de esta respuesta.

Answer 3

En la práctica, el uso de etiquetas de cierre automático en HTML debería funcionar como usted esperaría. Pero si le preocupa escribir HTML5 válido , debe comprender cómo se comporta el uso de dichas etiquetas dentro de los dos formularios de sintaxis diferentes que puede usar. HTML5 define una sintaxis HTML y una sintaxis XHTML, que son similares pero no idénticas. Cuál se usa depende del tipo de medio enviado por el servidor web.

Lo más probable es que sus páginas se sirvan como text/html , que sigue la sintaxis HTML más indulgente. En estos casos, HTML5 permite que ciertas etiquetas de inicio tengan un opcional / antes de que termine>. En estos casos, el / es opcional e ignorado, por lo que <hr> y <hr /> son idénticos. La especificación HTML llama a estos "elementos nulos" y proporciona una lista de elementos válidos. Estrictamente hablando, el opcional / solo es válido dentro de las etiquetas de inicio de estos elementos nulos; por ejemplo, <br /> y <hr /> son HTML5 válidos, pero <p /> no lo es.

La especificación HTML5 hace una clara distinción entre lo que es correcto para los autores de HTML y para los desarrolladores de navegadores web, y se requiere que el segundo grupo acepte todo tipo de sintaxis "heredada" no válida. En este caso, significa que los navegadores compatibles con HTML5 aceptarán etiquetas ilegales autocerradas, como <p /> , y las mostrarán como probablemente espera. Pero para un autor, esa página no sería válida en HTML5. (Lo que es más importante, el árbol DOM que se obtiene al usar este tipo de sintaxis ilegal se puede arruinar seriamente; las etiquetas <span /> , por ejemplo, tienden a ensuciar mucho las cosas).

(En el caso inusual de que su servidor sepa cómo enviar archivos XHTML como un tipo MIME XML, la página debe cumplir con la sintaxis DTD y XML de XHTML. Eso significa que las etiquetas de cierre automático son necesarias para aquellos elementos definidos como tales).

Answer 4

Las etiquetas de cierre automático son válidas en HTML5, pero no son necesarias.

<br> y <br /> están bien.

Answer 5

Tendría mucho cuidado con las etiquetas de cierre automático ya que este ejemplo demuestra:

var a = ''<span/><span/>'';
var d = document.createElement(''div'');
d.innerHTML = a
console.log(d.innerHTML) // "<span><span></span></span>"

Mi instinto habría sido <span></span><span></span> lugar

Answer 6

• En HTML 4 , <foo / (sí, con no > en absoluto) significa <foo> (que lleva a <br /> significado <br>> (es decir, <br>&gt; ) y <title/hello/ meaning <title>hello</title> ). Los navegadores hicieron un muy mal trabajo al admitir esto y la especificación aconseja a los autores evitar la sintaxis .

• En XHTML , <foo /> significa <foo></foo> . Esta es una regla XML que se aplica a todos los documentos XML. Dicho esto, XHTML a menudo se sirve como text/html que (históricamente al menos) es procesado por los navegadores utilizando un analizador diferente al de los documentos servidos como application/xhtml+xml . El W3C proporciona pautas de compatibilidad para XHTML como text/html . (Esencialmente: solo use la sintaxis de la etiqueta de cierre automático cuando el elemento esté definido como VACÍO (y la etiqueta final esté prohibida en la especificación HTML)).

• En HTML5 , el significado de <foo /> depende del tipo de elemento .

  • En los elementos HTML que se designan como elementos nulos (esencialmente "Un elemento que existía antes de HTML5 y que estaba prohibido tener cualquier contenido"), las etiquetas finales simplemente están prohibidas. La barra diagonal al final de la etiqueta de inicio está permitida, pero no tiene ningún significado. Es solo el azúcar sintáctico para personas (y resaltadores de sintaxis) que son adictos a XML.
  • En otros elementos HTML, la barra es un error, pero la recuperación de errores hará que los navegadores lo ignoren y traten la etiqueta como una etiqueta de inicio normal. Por lo general, esto terminará con una etiqueta final faltante que hará que los elementos posteriores sean hijos en lugar de hermanos.
  • Los elementos extraños (importados de aplicaciones XML como SVG) lo tratan como una sintaxis de cierre automático.