Is $(document).ready necessary?

jquery document-ready

59,618

Solution 1

Is $(document).ready necessary?

no

if you've placed all your scripts right before the </body> closing tag, you've done the exact same thing.

Additionally, if the script doesn't need to access the DOM, it won't matter where it's loaded beyond possible dependencies on other scripts.

For many CMS's, you don't have much choice of where the scripts get loaded, so it's good form for modular code to use the document.ready event. Do you really want to go back and debug old code if you reuse it elsewhere?

off-topic:

As a side note: you should use jQuery(function($){...}); instead of $(document).ready(function(){...}); as it forces the alias to $.

Solution 2

No, if your javascript is the last thing before close you won't need to add those tags.

As a side note, a shorthand for $(document).ready is the code below.

$(function() {
// do something on document ready
});

This question might be good. Did you read it? jQuery: Why use document.ready if external JS at bottom of page?

Solution 3

No, it isn't necessary provided you know you do not have any deferred stuff happening-- and in most cases you will know if you have developed what you are working on from top to bottom.

--It is when you bring in someone else's code, without thoroughly auditing it, that you don't know.

So, ask yourself are you using a framework or editor that helps you with the structure? Are you bringing in someone else's code and you haven't bothered to read through each file? Are you prepared to go through the Operating System, Browser, and Browser Version matrix of testing your code? Do you need to squeeze every single ounce of speed from your code?

document.ready() makes many of those question become irrelevant. document.ready() was designed to make your life easier. It comes at a small (and I dare say acceptable) performance hit.

Solution 4

I have seen references/blog post across the internet regarding the usage of jquery's document.ready. In my opinion both using it or putting all your javascript at the bottom of the page are both valid. And now the question would be which would be better? It is just a matter of programming style.

View more solutions

59,618

Author by

Joshua Robison

OCCUPATION: English as Foreign Language (EFL) Teacher in Japan. MULTIMEDIA: Can answer scripting questions related to HTML, CSS, JavaScript, Jquery Can answer design questions related to Photoshop, Illustrator, Inkscape, Gimp, Synfig Can answer 3D questions related to Blender, Maya, Polygon, Nurbs, SubDivision modeling etc. Specialize in web design, graphic design, photography video and print FAMILY: Oldest of two brothers and one sister. Am currently married with no children as of yet :p INTEREST/HOBBY: Some things I really enjoy in random order are: Playing guitar Playing piano Going on dates with my wife Going to 3d theater with my wife Spending time with friends and with wife Studying Christian philosophy and theology and history Teaching people about God Reading Japanese manga Studying Japanese, Korean, Greek and Hebrew Watching japanese Anime Web design, html5 and css3 3D modeling using Open source software such as BLENDER Digital Photography and Graphic Design Old Christian HYMNs redone Family worship Reformed Theology and theological discussion and debate Neighborhood ecclesiology with christian fellowship and corporate worship based on location rather than association Teaching English to Japanese people RELIGIOUS BELIEFS: Soteriology: Doctrines of Grace, Three Forms of Unity, TULIP, 5 Solas Ecclesiology: Neighborhood fellowship, Obedience is worship, The word Ecclesia does not mean church and is usually used by the Jewish writers of the New Testament to refer to the word Qahal in Hebrew which refers to any number of a multitude of people. Spiritually it refers to God's elect multitude who belong to Him and were saved through Jesus' propitiating sacrifice which is often called "the invisible church" What theologians refer to as "the visible church" is often not explained well and should not refer to "a church" but should refer to believers anywhere living obedient lives of faith whether they are alone in a desert or members of a family or l

Updated on October 06, 2020

Comments

Joshua Robison over 3 years

I saw this question in stackoverflow but do not feel that it was answered at all.

Is $(document).ready necessary?

I link all my javascripts at the bottom of the page so in theory they are all running after the document is ready anyways.
Zach Lysobey about 11 years

Are you sure that its the "exact same thing"? I was under the impression that your css (or other code loaded in parallel with the main html) may not yet be fully parsed.
zzzzBov about 11 years

@ZachL, the document may be ready before CSS is fully parsed. document.ready is not the same as the onload event, where images and other external assets have finished loading.
Zach Lysobey about 11 years

Thanks for the clarification.
nnnnnn almost 11 years

The question is essentially "Do I need document ready at all when I put my scripts at the bottom of the body?", not "Is there a shortcut way of writing $(document).ready()".
Qantas 94 Heavy over 10 years

Just something I saw - one of your edits got rejected, but it looks fine to me. You might want to resubmit that one: stackoverflow.com/review/suggested-edits/3224385
teejay about 10 years

This "no" just cost me 3 hours of work.. just make sure u dont mistake </body> with <body> :)
Jay Blanchard over 9 years

I don't necessarily agree with forcing the alias though, especially if noConflict() needs to be used for some reason.
zzzzBov over 9 years

@JayBlanchard, The alias is forced to $ within the callback where it would make sense for $ to refer to jQuery. You may, of course, change the alias to whatever you'd prefer to use.
thdoan about 8 years

For the equivalent of onload, use $(window).load().