CODEWITHSUNDEEP
javascriptjquery
mrblah
mrblah

Reputation: 103507

Does the order of javascript matter in a page?

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.

Upvotes: 2

Views: 7441

Answers (6)

seventeen
seventeen

Reputation: 1531

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?

Upvotes: 1

Josh
Josh

Reputation: 6322

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

Upvotes: 0

zombat
zombat

Reputation: 94167

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.

Upvotes: 6

Mike Trpcic
Mike Trpcic

Reputation: 25659

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:

  • External Libraries (jQuery, Prototype, ExtJS)
  • Plugins that build off of those libraries
  • My custom javascripts

I hope my answer was helpful.

Upvotes: 1

tvanfosson
tvanfosson

Reputation: 532465

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.

Upvotes: 4

M. Utku ALTINKAYA
M. Utku ALTINKAYA

Reputation: 2272

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.

Upvotes: 0

Related Questions