之前对html中的js脚本的运行顺序一直没有认真的去理清思路，只是把几个用到的脚本文件随便放在头部，后面的文本中调用。
但是没有了解其运行顺序，在写代码是有时候会造成混乱。
今天抽了点时间测试了一下。
一、当有外联js时：
1、外联js出现在<head>标签中的时候，这时候的脚本是最早运行的，同时也是按照文档顺序自上而下运行的。
2、外联js出现在<body>标签中的时候，这时候脚本也是按照文档顺序运行的，与内嵌<body>的js脚本一样，执行到该语句就运行。
二、当<head>标签中有js脚本段落时，如果没有在$(function(){ }); 中的话：它会立即执行。如果是在$(function(){ }); 里面， 但它将在文档加载完毕后执行的。
三、<body>标签的js脚本段运行的顺序是： 当执行到该语句就运行。
四、可能的话，js脚本的具体执行语句一般放在<body>最后面中,这样可以确定js脚本是在所有页面元素加载完后才执行的。
PS: 对于一些公用函数的外联脚本，尽可能的放在<head>标签前部。 在一个js文件中，函数的调用可以不考虑它定义的顺序。但在多个js文件中，不同
文件中的函数的相互调用就要考虑这些函数的定义顺序了，不然会出现undefined错误。
2、可以概括的讲，在没有用 $(function(){}); 包住的js脚本将会按照document文档的顺序执行，并且对于其函数的调用没有顺序要求，只要定义了就可以调用。 而被$(function(){}); 包住的js脚本，则是在文档加载完毕后在按照document文档顺序执行，其优先级将会低于外部。
见例子：
<html> <head> <script type="text/javascript" src="js/jquery.js"></script> // 最先加载 <script type="text/javascript" src="js/first.js"></script> <script type="text/javascript" src="js/second.js"></script> <script type="text/javascript"> var app = {}; // 紧跟着外联js运行 $(function(){ // 将会在document文件加载完毕后运行，一般卸载这个js片段的尾部 function a1(){ } b(); // 调用文档底部的b()函数成功 }); var dpp = {}; // 紧跟app执行 a1(); // 调用失败，a1()函数 未定义 b(); // 调用失败，b() 函数为定义，因为不是出在同意js代码段，b()函数在这里还没有定义。 a2(); // 调用成功，同一个js代码段的函数无先后顺序 function a2(){ } </script> </head> <body> <script type="text/javascript" src="js/body.js"></script> // 程序执行到这里将会加载外联js <script type="text/javascript"> a1(); // 将会调用失败，函数未定义 a2(); // 能调用成功，函数已经在前面的js片段中定义了
b(); // 成功调用本js代码片段的函数
function b(){
}
$(function(){ // 这里面的代码将在前面的$(function(){}) 执行后在执行
// 代码
}) </script> </body> </html>