DOM, de manera sencilla y entendible

Antes de navegar en las profundidades del objeto XMLHttpRequest hay que explicar un poco el uso de otras herramientas que probablemente utilicemos para dar un mejor aspecto a la presentación de la aplicación que queremos realizar. DOM por sus siglas en ingles (Document Object Model) es nuestra interfaz de programación básica de aplicaciones que brinda un conjunto de objetos que nos permiten representar, dibujar o esgrimir código HTML y XML a su vez dándonos la posibilidad de acceder a ellos y manipularlos.

Si visitamos la Historia de finales de los 90 acerca del desarrollo web nos daremos cuenta de que se habla mucho de DHTML, si fue el boom de la época, pero ahora no es mas que un cumulo de técnicas que no deberían usarse y que solo se ajustan a la aplicación de efectos en Navegadores desactualizados. La utilización de DHTML en estos días esta sujeta a muchos sacrificios que no se previeron en su tiempo dorado, tales como dependencia de navegadores, falta de actualización de dichos scripts que fueron masificados y puestos en páginas a disposición de muchos desarrolladores que solo se preocuparon por la manera de Usarlos y no actualizarlos, lo cual vuelve un caos la aplicación si otros desarrolladores se unen a su mantenimiento sin contar que muchas de esas pequeñas grandes cosas estaban tan mal diseñadas y escritas que terminaban haciendo la pagina mas lenta, sucia y vulnerable con la actualización de los estándares.

¿Pero qué es DOM? Y ¿Qué puedo hacer con el?

DOM, es una manera de trabajar combinando XHTML y JavaScript o mejor digamos que es la capacidad otorgada por la interactividad de los dos lenguajes para que uno pueda acceder los objetos o elementos del otro. No hay mejor manera de explicarlo que con un ejemplo.

Digamos que tenemos cierta porción de Texto encerrada en un contenedor que queremos hacer invisible al ocurrir un evento.

El enlace llama a la funcion escrita en JavaScript “Esconder()” y este busca en el documento el elemento cuya id sea “porcionTexto” que es nuestra div y le coloque el estatus de visibilidad en “escondido” y de esta manera hemos accesado directamente el elemento y hemos modificado sus propiedades.

Cada tipo de Objeto DOM es único, inclusive si dos objetos se “ven” de manera idéntica en tu navegador, es importante que tres facetas definan el objeto per se, estas facetas son: ¿como se ve?, ¿Como luce? y ¿como se comporta?.
Estas facetas en el ámbito de la programación orientada a objetos se llaman, propiedades, métodos y manejadores de eventos.

Aqui les dejo una cheat sheet sobre la mayoria de los metodos de DOM o por lo menos los más usados. Por cierto tengo muchos cheat sheets y libros relacionados con el tema almacenados en casa a su disposición solo tienen que pedirlos de manera cortes. Saludos.

Anuncios