JavaScript event handlers execution order

Question

Having this JS code:

document.getElementById(\'e1\').addEventListener(\'click\', function(){alert(\'1\');}, false);
document.getElementById(\'e2\').addEventL         


        

Answer 1

I will be 1 and then 2 . http://jsfiddle.net/kkYfX/

Answer 2

The alerts will be executed in order - 1 and then 2. This is because click event is synchronous (see here) - when .click() is issued the handler will be run immediately (look at the last paragraph here). So this code:

document.getElementById('e1').addEventListener('click', function(){alert('1');}, false);
document.getElementById('e2').addEventListener('click', function(){alert('2');}, false);
document.getElementById('e1').click();
document.getElementById('e2').click();
alert('3');

will produce the same result as

alert('1');
alert('2');
alert('3');