What is loading first in this script?
In terms of loading order, what is happening in this script? Does the divLoading div tag finish loading before the jquery libraries finish loading? And, do the libraries start loading before the divLoading di开发者_JS百科v tag is created on the users screen?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
</head>
<body>
<div id="divLoading">loading...</div>
<img src="http://goes.gsfc.nasa.gov/pub/goes/060619_fulldisk_color.jpg" />
</body>
</html>
JS is blocking, so HTML parsing will pause while the scripts are loaded.
Jquery is requested, jQuery UI is requested. You don't have any JavaScript code to wait for the page to render or anything. You can use Firebug to investigate what gets loaded, when and how long it took:
http://getfirebug.com/
Scripts are run serially in the order in which they're referenced. So, jQuery will be loaded first and then jQuery UI. (The browser might download both at the same time, and may or may not finish downloading one before the other, but processing will be ran first-in/first-out.)
JavaScript, also, is blocking (nothing else on the page will load), so the scripts will be entirely downloaded and processed before the browser even considers what is in the body tag.
Not to reiterate what has been posted, but the js will load first and will block any other elements from being downloaded, hence it is a best practice to move all of your scripts to the bottom of the page, if you are using jquery, than I am assuming you are using the document.ready listener to wrap all of your actions. If this is the case, any actions would not take place until the DOM is ready so there w(sh)ould be no harm in moving the files.
http://developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5/
This is a good question in that it raises a fundamental concept in HTTP client/server interaction.
精彩评论