Menu
I have a question on jQuery $(document).ready
Let's say we have a HTML page which includes 2 JavaScript files
<script language="javascript" src="script1.js" ></script> <script language="javascript" src="script2.js" ></script> Now let's say in both these script files, we have $(document) as follows
Inside script1.js:
$(document).ready(function(){ globalVar = 1; }) Inside script2.js:
$(document).ready(function(){ globalVar = 2; }) Now my Questions are:
- Will both these ready event function get fired ?
- If yes, what will the order in which they get fired, since the document will be ready at the same time for both of them?
- Is this approach recommended OR we should ideally have only 1 $(document).ready ?
- Is the order of execution same across all the browsers (IE,FF,etc)?
Thank you.
590
The key difference between $(document). 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.
Yes we can do it as like I did in below example both the $(document). ready will get called, first come first served.
$( document ). ready()A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside $( document ). ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute.
So technically they are both the same. Not major difference between these two declaration. They used based on weather you use JavaScript then you should use $(document). ready declaration in other case you use jQuery library which is a part of JavaScript then you should use $(function) declaration.
- Will both these ready event function get fired ?
Yes, they will both get fired.
- what will the order in which they get fired, since the document will be ready at the same time for both of them?
In the way they appear (top to bottom), because the ready event will be fired once, and all the event listeners will get notified one after another.
- Is this approach recommended OR we should ideally have only 1 $(document).ready ?
It is OK to do it like that. If you can have them in the same block code it would be easier to manage, but that's all there is to it. Update: Apparently I forgot to mention, you will increase the size of your JavaScript code if you do this in multiple files.
- Is the order of execution same across all the browsers (IE,FF,etc)?
Yes, because jQuery takes the cross-browser normalization at hand.
86
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
