Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the non-jQuery equivalent of '$(document).ready()'?

What is the non-jQuery equivalent of $(document).ready()?

like image 326
TIMEX Avatar asked Feb 21 '10 05:02

TIMEX


People also ask

What is replacement of $( document .ready function?

load(function(){ // ...}) @undefined, this is almost the same as $(document). ready(function(){ ... }) . load() will wait until the graphics are also loaded.

What is the JavaScript equivalent of document ready?

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.

What is $( document .ready () and $( window .load () in jQuery?

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.


1 Answers

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.

like image 78
sospedra Avatar answered Sep 27 '22 21:09

sospedra