网页前段script优化
javascript标签到底是应该放在头部还是尾部
按照我们的书写习惯，我们通常把javascript标签放到头部，比如这样
<html>
<head>
<script type="text/javascript" src="http://s.segmentfault.com/js/jquery.js"></script>
</head>
<body>
...
</body>
</html>
但是也有一说，由于html中的js是按顺序加载的，如果js没有加载就会阻塞后面的html加载，所以考虑到网页载入流畅，应该把javascript放到最后面。
那么应该按照什么原则来放置js标签的位置呢?
问题被采纳后将获得 +20 的悬赏声望
4 个回答
Good Question，我一般都放底部，原因同你所说。
但在某种情况下我也觉得放在头部比较好，比如一个给页面中的某个元素添加了事件的js脚本。页面出来了但是js没加载完的那段时间，用户对此元素做事件操作的时候就出不来应该有的效果。
我现在是比较倾向于放在头部，做一些优化的工作尽量让js加载快一点。
再听听其他人怎么说吧最近的做法是写个 load.js 放在最上面
需要立即执行的就直接扔在 html 结构后面
通用的脚本引用统一放在页脚由 js load 载入一个示例如下
GLOBAL_VAR.load(['require.js', 'function1.js', 'fn2.js'], callback);
load 这个方法其实就是在 domReady 之后很挫的往 head 里插 <script src="require.js"> 这样就不会有脚本阻塞了
再根据约定(require.js 内必须为 GLOBAL_VAR['require'] = ... 唔, 其实有一个 GLOBAL_VAR.add 专门来处理 )来检查 GLOBAL_VAR.require 对象是否存在之后再去调用 callback-
按照yahoo提出的web开发的优化法则的建议是，js应该放在页面底部，因为js的下载是阻塞方式的，如果js放在顶部，并且js的量又很大，那会因为加载js阻塞了页面其他元素的加载导致整个页面刚开始会显示空白。但是随着ajax技术的发展，现在已经有了很多异步加载js的方法，因此js放在顶部也是可以的。具体的异步加载方式很多，具体你可以自己上网搜索一下。
-
ck2265395 
seawater 
wf1006
http://www.ibm.com/developerworks/cn/... 个人情况放底部比较多. 还是得实际情况实际分析的样子...毕竟js是门灵活的语言..规范之谈只是对初学者而言.
@苏淼 虽然具体情况具体分析说法没错，一笔带过不用去动脑筋，不过如果没有人能真正去琢磨研究他，他永远就是一个烦人的问题。理想状态下正如 @issac 所说的那样做，但总是说起来很简单，实际操作的时候很烦人？如果代码放两边，以后的维护性问题如何解决？当一个放底部的js需要放头部的时候，你真会记得去挪位置吗？如果代码变得需要重构的时候，你真的会去重构？ 另外我也并不认为他完全是一个初学者问题，更不应该说他是初学者问题而轻视他。 我现在比较倾向于放头部，因为我觉得保证功能能用是第一，速度可以考虑用cdn，加长cache寿命，压缩传输字节等方法去优化加载时间。另外我也不建议按需求分开放，因为这么做要关心的事情会跟文件数量的增长而成指数被增长，如果都放一起就只用关心加载顺序就行了
@chris 仔细想了一下,确实不错,js功能可用为第一,并且通过后天维护来保证其不被阻塞以及速度优化,这一种是保证自己元素加上自己的js.还有一种情况在于,采用的是其他站点提供的api.例如google的+1载入超慢,只好把它放到最后.以保证整个页面的显示速度.按需加载其实是个好主意..就是维护性....