这里关系到浏览器性能的问题。 众所周知，如果吧script写在head中，那么文档需要等到head加载完毕才会显示出来。
<!DOCTYPE html> <html lang="en"> <head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="test.js"></script> <link href="css/style.css" rel="stylesheet"> </head> <body> <div> this is a test </div> </body> </html>test.js
var count = 0; while (true) { count++ }这里我们的test写了一个死循环，也就是页面不可能会加载出来
如果我们调换一下script的位置，那么就不一样了。
<body> <div> this is a test </div> <script src="test.js"></script> </body>因此通常我们的建议是将script标签放在body之后，像jquery里面的$(document).ready就是dom文档已经加载完毕。（当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件） 这里科普一下
$(document).load();
当web页面以及其附带的资源文件，如CSS，Scripts，图片等，加载完毕后执行此方法。常用于检测页面（及其附带资源）是否加载完毕。
$(document).ready(); 当页面DOM对象加载完毕，web浏览器能够运行JS时，此方法即被触发。如果你想尽快执行JS，可以使用此方法。[在html的头部的script标签中的，不处于ready()中的JS代码将早于ready()执行]
$(document).unload(); 此事件在停止浏览页面的时候触发，此操作可能存在于刷新操作/F5，单击上一页按钮，进入其他页面或关闭整个tab或窗口。
defer与async 我们知道还有一种方式可以使script延迟加载，就是使用defer和async属性。 推荐一篇博文： http://blog.csdn.net/renfufei/article/details/10210949
现在WebKit为html5实现了SCRIPT标签的async异步属性。过去我们使用各种JavaScript技巧来做这种事情，但现在新的属性让防止阻塞变得相对容易。 也就是说只有ie9以及以上的浏览器才能支持这个属性。
<!-- 指定async,以及 onload 回调--> <script async src="siteScript.js" onload="myInit()"></script>Safari 浏览器额外添加了defer属性
<!-- 指定defer,效果和async差不多--> <script defer src="siteScript.js" onload="myInit()"></script>defer和async的区别在于，defer是顺序加载，async是无序，即你不知道指定了async属性的几个script究竟谁先加载，如果这几个文件有依赖性，那么就完蛋了。
