What is the non-jQuery equivalent of $(document).ready()
?
load(function(){ // ...}) @undefined, this is almost the same as $(document). ready(function(){ ... }) . load() will wait until the graphics are also loaded.
jQuery $(document). ready() Equivalent in JavaScript This event fires when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.
ready() and $(window). load() event is that the code included inside onload function will run once the entire page(images, iframes, stylesheets,etc) are loaded whereas the $(document). ready() event fires before all images,iframes etc. are loaded, but after the whole DOM itself is ready.
This works perfectly, from ECMA. The snippet is all you need, but if you want to dig more and explore other options check this detailed explanation.
document.addEventListener("DOMContentLoaded", function() { // code... });
The window.onload
doesn't equal to JQuery $(document).ready
because $(document).ready
waits only to the DOM tree while window.onload
check all elements including external assets and images.
EDIT: Added IE8 and older equivalent, thanks to Jan Derk's observation. You may read the source of this code on MDN:
// alternative to DOMContentLoaded document.onreadystatechange = function () { if (document.readyState == "interactive") { // Initialize your application or run some code. } }
There are other options apart from "interactive"
. See the MDN docs for details.
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