Hi,
As long as I am calling my javascript code from within the jquery $().ready(); function shouldn't I have access to all variables declared in my javascript code?
I have code coming from .js files and inline.
I tried to access a variable and it says it is not defined, but when I do a viewsource I can see that variable.
Yes you can access all top level variables. But the one you are looking for may be defined using dom ready event too even it is a window variable the handler can be being fired after yours. Or it is in a JavaScript file dynamically injected.
You won't necessarily have access to the variable. It would really depend on the scope of the variable and where it is defined relative to where it is being used. If the variable is defined in a separate ready() block, you may not have access to it even if it is in the global space if that ready block is run after the one where you reference it. To be available, the code that defines the variable needs to execute before the code that references it and it needs to be in the same scope.
No, you should always load Javascript in the order that it's needed. If you're using some jQuery plugins, then you should load jQuery before those plugins, as they may instantiate something that uses the jQuery object(s) without you knowing.
For my web applications, I load javascripts in the following order:
I hope my answer was helpful.
You are right, there should be no problem accessing variables in other files. There may be a problem with scope or a simple typo. In what scope is the variable you are trying to access, and in what scope are you trying to use it?
The order of javascript does indeed matter. Javascript is executed in a linear manner within the page, so if you have two <script> tags like this:
<script src="test1.js"></script>
<script src="test2.js"></script>
test1.js will be loaded and run first, then test2.js. Anything declared globally in test1.js will be accessible in the second script, but not the other way around.
A side effect of this is that scripts also block when they are loaded, so if test1.js took a long time to load, you would see that slow down the page loading time. This is why it is recommended to put any javascript that's not immediately necessary at the bottom of your page, so that almost the entire thing will show up right before the javascript loading slows it down.
Inside the "on ready" event in jquery, you should theoretically have access to anything that was loaded as part of the DOM, as this should technically not fire before the DOM structure has been entirely built.
you can set your variable value in any part of the page but it would be easier to declare them at the top of the page before your function code.
Josh