¿Que es el DOM de un HTML?

Posted on:23 marzo, 2017

Author:Andros Fenollosa Hurtado

Category:programación

Share: / /

 

Las siglas DOM significan de su traducción del inglés como la representación de un documento mediante objetos. Es una interfaz de programación que proporciona un conjunto de estándares de objetos para representar diferentes documentos como por ejemplo HTML. Este modelo nos indica cómo se combinan los objetos y proporciona una interfaz para acceder a ellos y manipularlos.

En la imagen anterior se puede observar una estructura en árbol que puede tener un documento HTML. El primer elemento que engloba toda la información es la ventana, a continuación puede contener elementos como un documento con formularios, etc. La interfaz DOM reconstruye el documento HTML en forma de árbol en la memoria pudiendo así acceder a cualquier elemento del archivo original en cualquier momento.

En resumen, como modelo de objetos , el DOM identifica:

  • Interfaces y objetos usados para represnetar y manipular un documento.
  • La semántica y objetos, incluyendo comportamiento y atributos.
  • Las relaciones y colaboraciones entre estas interfaces y objetos.

 

API

La interfaz DOM proporciona un conjunto de métodos para realizar operaciones que son independientes de cualquier ejemplar particular del modelo de objetos del documento. Una vez que DOM ha creado de forma automática el árbol completo de nodos de la página, ya es posible utilizar sus funciones para obtener información sobre los nodos o manipular su contenido.

Muchas funciones que proporciona DOM es necesario primero acceder al elemento inmediatamente superior a él. Para solucionar este problema, DOM proporciona una serie de métodos para acceder de forma directa a los nodos deseados. Los métodos disponibles son:

  • getElementsByTagName(): que obtiene todos los elementos del árbol cuya etiqueta sea igual que el parámetro que se le pasa a la función.
  • getElementsByName(): obtenemos los elementos cuyo atributo name coincida con el parámetro pasado.
  • getElementById(): que es la función para acceder directamente a un nodo.

 

A partir de ahora cada vez que veamos que se habla del llamado DOM en una página web o documento HTML, tendremos claro de que se trata. Es necesario tener clara la estructura de los documentos HTML si queremos realizar un desarrollo web o si vamos a trabajar usando JavaScript o jQuery.

Leave a comment