JavaScript: Manejando la interacción del usuario

En el manejo con JavaScript de la interacción del usuario con nuestra página,- nuestro widget, nuestra web app… –  la delegación de eventos es una estrategia que debemos conocer.

No hace falta ser un experto en JavaScript para afirmar que la delegación de eventos es una práctica muy recomendable y argumentar que beneficia el rendimiento y mantenimiento de nuestro software,- sin ir más lejos, yo lo leí consultando la API de jQuery.

¿Que aún no has oído hablar de la delegación de eventos? El concepto es sencillo: Imagina que tienes una lista,- ul, li, li, li, li… ya sabes como va – y quieres escribir el contenido de los elementos de la lista en algún sitio cuando el usuario clique sobre ellos.

Cuando estás empezando a trabajar con JavaScript, la solución inmediata es observar cada uno de los elementos de la lista por separado en espera de que el usuario clique sobre ellos; hay, sin embargo, otra posibilidad: observar la lista en su conjunto. Ésto es la delegación de eventos.

A continuación encontrarás los dos escenarios descritos resueltos con jQuery.

Fácil ¿o no? No te dejes engañar por la aparente sencillez de las soluciones que jQuery posibilita.

¿Podrías explicar qué hace posible poder observar la lista en su conjunto? ¿Es jQuery el que lo hace posible? ¿Necesito jQuery,- podríamos añadir? Empezando por el final: no, no necesitas jQuery para resolver la delegación de eventos,- pero hay que reconocer que lo pone muy fácil.

¿Entonces? La respuesta obvia es la acertada: porque los li están dentro del ul. No tiene que ver con jQuery sino con la propagación de los eventos.

Como ves, una pieza tan breve de código da pie a hablar, además de la delegación de eventos, de la propagación de los eventos a través del DOM y del uso de un framework para gestionar la delegación de eventos.

Si te interesa aprender más al respecto quiero recomendarte la lectura de An Introduction To DOM Events, artículo publicado por Wilson Page en Smashing Magazine en noviembre de 2013. En mi opinión es una muy buena fuente de información acerca del manejo de los eventos del DOM,- y créeme: he leído un poquito al respecto.

Deja un comentario