Los eventos en JavaScript pueden clasificarse en varias categorías según la naturaleza de la interacción o la fuente del evento. Conocer los diferentes tipos de eventos te permitirá manejar las interacciones del usuario y otras ocurrencias de manera más eficiente y organizada.

Eventos del Mouse

Los eventos relacionados con el mouse son aquellos que ocurren cuando el usuario interactúa con el mouse. Algunos de los más comunes son:

• click: Se desencadena cuando un elemento es clicado.
• dblclick: Se desencadena cuando un elemento es doble clicado.
• mouseover: Se desencadena cuando el cursor del mouse pasa sobre un elemento.
• mouseout: Se desencadena cuando el cursor del mouse sale de un elemento.
• mousemove: Se desencadena cuando el mouse se mueve dentro de un elemento.

Ejemplo:

html

Eventos del Teclado

Estos eventos se producen cuando el usuario interactúa con el teclado. Los más comunes incluyen:

• keydown: Se desencadena cuando una tecla es presionada.
• keyup: Se desencadena cuando una tecla es soltada.
• keypress: Se desencadena cuando una tecla es presionada y soltada.

Ejemplo:

html

Eventos de Formulario

Estos eventos ocurren principalmente en relación con formularios HTML. Los más usados son:

• submit: Se desencadena cuando un formulario es enviado.
• change: Se desencadena cuando el valor de un elemento de formulario cambia.
• focus: Se desencadena cuando un elemento recibe el foco.
• blur: Se desencadena cuando un elemento pierde el foco.

Ejemplo:

html

Eventos de Carga

Estos eventos se relacionan con la carga de recursos en la página web.

• load: Se desencadena cuando un recurso (como una imagen o un script) ha sido completamente cargado.
• unload: Se desencadena cuando la página está a punto de descargarse.

Ejemplo:

html

Eventos de Foco y Desenfoque

Estos eventos se activan cuando un elemento obtiene o pierde el foco.

• focus: Se desencadena cuando un elemento recibe el foco.
• blur: Se desencadena cuando un elemento pierde el foco.

Ejemplo:

html

Eventos Temporales

Estos eventos ocurren en relación con el tiempo.

• setTimeout: Ejecuta una función después de un período de tiempo específico.
• setInterval: Ejecuta una función repetidamente en intervalos específicos.

Ejemplo:

html

Placeholder para imagen

Estos son solo algunos de los tipos de eventos que JavaScript ofrece. Dominar el manejo de estos eventos te permitirá crear aplicaciones web más interactivas y dinámicas.