Jquery DOM Ready
Understand the Syntax used to wait for the Document to get ready.
Jquery Syntax : Waiting for the DOM
For the jQuery script to execute correctly, the browser must have downloaded all object in the DOM completely before the script begins to execute.
This is done by passing the document variable to the function $ , and then calling the ready method with the function to be executed when the DOM is ready(i.e loaded completely)
Syntax: Jquery ready function
Example: Jquery ready functionGive it a TRY! » Note:This method ensures that script will be executed correctly no matter where it is placed in the Document
Jquery DOM Waiting : Using an alternative Notation
An alternative approach is to pass your function as a parameter to the jQuery $ function.
It is equivalent of using the $(document).ready approach.
Syntax: Jquery Syntax to wait for the DOM to get ready
Example: Jquery Syntax to wait for the DOM to get readyGive it a TRY! » Note: The alternative Notation performs defers the execution of the Function until the DOM is ready.
Jquery Syntax : Deferring the ready Event
You can even control when the ready event is triggered by using the method holdready , it is useful when external resources are loaded dynamically.
The method holdready must be called before the ready event is triggered, and the function can be called again when ready by setting the value of holdready as false.
In the demo below, the method holdready method is called at the start of the script, and the setTimeout method is used to invoke the function after 3000ms.
Finally, the ready event is triggered again by calling the holdready method with the argument as false.
Syntax: Jquery Deferring Ready Event
Example: Jquery Deferring Ready EventGive it a TRY! » Note:The ready event is delayed after 3 seconds.
Note: The method holdready can be called a number of times.