Introducción al artículo de Wulin.com (www.vevb.com): los blogs han cambiado durante mucho tiempo a la escritura HTML5, pero muchos usuarios no han utilizado el último navegador y han estado utilizando conjuntos de etiquetas HTML4. HTML5 tiene muchas etiquetas semánticas y prácticas. También he comenzado a probar algunas etiquetas de uso común, y ahora uso artículos y etiquetas de tiempo.
HTML5 ofrece a los desarrolladores muchas etiquetas nuevas, como sección, NAV, artículo, encabezado y pie de página. Estas etiquetas son altamente semánticas y se usarán con frecuencia, pero no se pueden reconocer y usar normalmente en navegadores antiguos como IE6, IE7, IE8 y Firefox 2.
¿Por qué los navegadores a la antigua no pueden reconocer estas etiquetas?
De hecho, la falla no es el navegador, porque este tipo de etiqueta no existía en absoluto en esa época, por lo que no se puede identificar correctamente. Este reconocimiento de etiqueta inusual hace que la estructura DOM sea anormal.
Tenemos el código de prueba de la siguiente manera. Es un contenido de artículo con el título y las palabras azules, y el contenido del artículo está etiquetado con el artículo.
<! Doctype html><html xmlns = lang = zh-cn>
<Evista>
<meta charset = utf-8 />
<title> test </title>
<estilo>
Artículo {color:#06f;}
</style>
</ablo>
<Body>
<h1> Título del artículo </h1>
<Artículo>
Este es el contenido del artículo, debe ser una pieza de texto azul. En los navegadores antiguos, si no haces hacks, se mostrará una excepción.
</artículo>
</body>
</html>
En IE8, se muestra lo siguiente.
IE8 no reconoce la etiqueta del artículo, y el estilo CSS definido en la etiqueta no tiene ningún efecto. En IE8, <artículo> se interpreta como dos elementos de etiqueta vacíos llamados <Artículo /> y < /artículo />, que se enumeran como nodos hermanos junto con el contenido del artículo, como se muestra en la figura a continuación.
¿Cómo usar etiquetas HTML5 en navegadores pasados de moda?
Como no se puede usar porque no se puede reconocer, la solución es hacer que la etiqueta se identifique. Afortunadamente, simplemente usando document.CreateElement (TagName) permite que el navegador reconozca la etiqueta y el motor CSS para conocer la existencia de la etiqueta. Supongamos que el área <cead> de nuestro ejemplo anterior se agrega con el siguiente código.
<script>document.createElement ('artículo');
</script>
La explicación DOM en IE8 se mostrará en la figura a continuación.
Naturalmente, el texto también aparece en azul normal.
Conclusión
El blog ha cambiado durante mucho tiempo a la escritura HTML5, pero muchos usuarios no han utilizado el último navegador y han estado usando conjuntos de etiquetas HTML4. HTML5 tiene muchas etiquetas semánticas y prácticas. También he comenzado a probar algunas etiquetas de uso común, y ahora uso artículos y etiquetas de tiempo.