A diferencia de los ejemplos anteriores, no he empleado en el marcado ningún onclick.

Ejemplo de fujo de eventos: `addEventListener` con su tercer parámetro establecido a `false`

Este ejemplo no funciona en Internet Explorer, por motivos que veremos de vuelta al curso.

En este documento he establecido tres escuchas, una para body, una para el div que contiene un botón, y otra para el propio botón. Todas ellas lanzan una función que devuelve una alerta con el elemento que ha recibido el evento:


    function alerta(){
        alert(this);
    }
    
    window.onload = function (){
        var elBody = document.getElementsByTagName('body')[0];
        var elDiv = document.getElementById('elDiv');
        var elButton = document.getElementById('elButton');
        elBody.addEventListener('click',alerta,false);
        elDiv.addEventListener('click',alerta,false);
        elButton.addEventListener('click',alerta,false);
    }

Si se hace clic sobre el botón:

se obtienen tres respuestas, [object HTMLButtonElement], [object HTMLDivElement] y [object HTMLBodyElement]. El flujo de eventos, por tanto, ha sido el inverso, y el orden de respuesta ha dependido de la burbuja.

Volver al curso

Ejemplo de fujo de eventos: addEventListener con su tercer parámetro establecido a false

Ejemplo de fujo de eventos: `addEventListener` con su tercer parámetro establecido a `false`