It seems to me that both events are fired when every resource and its dependent resources have finished loading. This rises some questions:
Difference is that, window.onload event will only be called once, and it will override the previously attach onload event. While on the other hand, using window.addEventListener you can add as many functions as you want and they will all be called in parallel. For example, take the following code:
window.onload By default, it is fired when the entire page loads, including its content (images, css, scripts, etc.) In some browsers it now takes over the role of document.onload and fires when the DOM is ready as well.
While the document ready is a jQuery event which means that it is only available in the jQuery library, the window.onload is a pure JavaScript event, and therefore, available in most browsers and libraries. The other main difference is apparent from their definitions.
onloads: The onloads event is fired when an object is fully loaded, there are two types of onload event one is windows onload and body onload. Windows onload: This window’s onload event fires at the start.
As you say, they both do exactly the same thing. The advantage of addEventListener
is that you can add more than one event listener to the load event.
From some basic testing, it seems the listeners get called in the order they were set, though I don't know how reliable that is.
You can use either method to do whatever you need.
They do NOT do exactly the same thing, at least in Firefox.
The reason is that window.onload
is equivalent to window.addEventListener("load")
, not document.addEventListener("load")
.
Although, all documentation I have seen says that they are equivalent.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With