延迟脚本
如果想放在<head>
里面,也是可以的,使用html4.01定义的defer属性,用法如下:这样设置相当于是告诉浏览器立即下载,但是延迟执行。
<head>
<script src="js/index" defer="defer"></script>
</head>
有了defer属性,包含的脚本将会在遇到</html>
才会执行。
HTML5规范要求脚本按照它们出现的先后顺序执行,因此第一个延迟脚本会先于第二个延迟脚本执行,而这两个脚本会先于DOMContentLoaded事件先执行。在现实中,延迟脚本不一定会按照顺序执行,也不一定在DOMContentLoaded事件触发前执行,因此最好包含一个脚本。
defer属性只适用于外部脚本文件。但是在HTML5中,支持HTML5的实现会忽略给脚本设置的defer属性。
兼容性:
IE4~IE8支持对嵌入脚本的defer属性,但IE8及之后版本则完全支持HTML5规定的行为。
IE4、Firefox3.5、Safari 5和Chrome最早支持defer属性。其他浏览器会忽略。
在XHTML文档中,要把defer属性写成:defer="defer"
异步脚本
HTML5提供的async属性,与defer类似。都用于处理脚本。只适用于外部文件,并告诉浏览器立即下载文件。标记async的脚本并不保证会按照它们指定的顺序执行。
如果引入两个脚本,最好它们之间互不依赖。
为什么要使用async?
不让页面等待两个脚本下载和执行,从而异步加载页面的其他内容。所以建议:
异步脚本不要在加载期间修改DOM。
异步脚本一定会在load事件前执行,但可能会在DOMContentLoaded事件触发之前或者之后执行。
兼容性:
支持异步脚本的浏览器有:Firefox3.6、Safari 5和Chrome。
在XHTML中,要把async属性设置为:async="async"