With some severe "snipping", my code is as follows:
var myExtension = new function ()
{
this.init = function ()
{
/* initialise page load listener */
var appcontent = document.getElementById ("appcontent");
if ( appcontent )
{
appcontent.addEventListener ( "load", myExtension.onPageLoad, true );
}
};
this.onPageLoad = function ( aEvent )
{
var doc = aEvent.originalTarget;
alert ( "Test!" );
};
}
/* initialise window listener */
window.addEventListener ( "load", function () { myExtension.init(); }, false );
This is pretty much taken pretty much exactly from here. The one real change I made is changing the "DOMContentLoaded" event type to "load", as it made more sense to me at the time. I've got two real questions for you: firstly, why can't the external listener ("window.addEventListener(...)") point directly to the myExtension.onPageLoad function? I assume that it's something to do with what object triggers the event, and therefore how to access the "originalTarget" bit within onPageLoad, but a bit of an explanation would be grand.Secondly, what's the difference between "load" and "DOMContentLoaded"? Based on this page, it gives a pretty good explanation of what the difference is, so that's great. My main issue here is that, when using "load" and opening a typical page (e.g. Google) I get 4 alerts saying "Test!" when it's loaded. I even get 3 for opening a new tab! It's not a problem so much as a confusion. Why does opening a new tab trigger the "load" event three or four (or even more!) times, and the DOMContentLoaded event just once?
Cheers in advance!














