Cargando



HTML5 – DOM Metadata

En este tutorial veremos cómo podemos extraer los metadatos utilizando las herramientas del DOM, con teoría sencilla y ejemplos prácticos de su aplicación.


nov 13 2013 16:32
Profesional
nov 13 2013 19:32
El DOM es bastante útil a la hora de recolectar datos del documento, ya que nos permite establecer muchas respuestas a interrogantes válidas que podamos tener, para ello podemos usar los metadata del documento, extrayéndolo con las herramientas que nos ofrece el DOM de forma que podamos saber qué tipo de encoding existe, última modificación del documento y otros datos relevantes que necesitemos.

Obteniendo la información del documento

Como mencionamos es posible extraer información del documento HTML utilizando los metadata, para ello nos valdremos de las funciones del DOM para poder traer la información y mostrarla.

Veamos un poco de código donde podemos extraer algunos datos relevantes del documento:

<!DOCTYPE HTML>
<html>
<head>
	 <title>Example</title>
	 </head>
<body>
	<script>		
		 document.writeln("<pre>");
		 [b]document.writeln("characterSet: " + document.characterSet); [/b]
[b]		 document.writeln("charset: " + document.charset); [/b]
[b]		 document.writeln("compatMode: " + document.compatMode); [/b]
[b]		 document.writeln("defaultCharset: " + document.defaultCharset); [/b]
[b]		 document.writeln("dir: " + document.dir); [/b]
		 [b]document.writeln("domain: " + document.domain); [/b]
[b]		 document.writeln("lastModified: " + document.lastModified); [/b]
[b]		 document.writeln("referrer: " + document.referrer); [/b]
[b]		 document.writeln("title: " + document.title);[/b]		
		 document.write("</pre>");
	 </script>
</body>
</html>

Esto nos produce la siguiente salida en nuestro navegador:

html5_dommetadata.jpg


Como vemos existe una cantidad de información valiosa que nos permite entender de mejor manera el tipo de documento con el que estamos trabajando.

Ya que hemos visto cómo se puede trabajar con los metadata, vamos a ver cada uno de los que tenemos disponibles que información contienen y así podemos definir que nos puede ser útil o no.

characterSet: Retorna el encoding del set de caracteres del documento. Esta propiedad es de solo lectura.

charset: Obtiene o establece el encoding del set de caracteres del documento.

compatMode: Obtiene el modo de compatibilidad del documento.

cookie: Obtiene o establece las cookies para el documento actual.

defaultCharset: Obtiene el encoding del set de caracteres por defecto que tiene el navegador establecido.

defaultView: Retorna el documento Window para el documento actual.

dir: Obtiene o establece la dirección en texto del documento.

domain: Obtiene o establece el dominio del documento actual.

implementation: Da la información de que características del DOM están disponibles

lastModified: Retorna la fecha de la última modificación del documento actual, o la fecha actual si la información no está disponible

location: Ofrece información sobre la URL del documento actual.

readyState: Retorna el estado del documento actual, es una propiedad de solo lectura.

referrer: Retorna el URL del documento que hizo enlace al documento actual, este es el valor del header HTTP correspondiente.

title: Obtiene o establece el título del documento actual.

Hagamos un paréntesis y hablemos sobre el modo de compatibilidad, la propiedad compactMode nos dice como el navegador ha manejado e interpretado el contenido del documento actual, esto es debido a que existe mucho código que no cumple con los estándares, sin embargo para no perder funcionalidad el navegador intenta mostrar el contenido, el compactMode nos dice si es HTML estándar o si no lo es mostrando CSS1Compat para la primera opción y BackCompat para la segunda.

Con esto finalizamos nuestro tutorial, ya tenemos más herramientas y conocimiento de que podemos hacer con el DOM y como obtener las propiedades de nuestro documento a través de sus metadatos.

¿Te ayudó este Tutorial?


Sin comentarios, sé el primero!

No esperes más y entra en Solvetic
Deja tus comentarios y aprovecha las ventajas de la cuenta de usuario ¡Únete!

X