-_-#【JS】defer / async
引用JavaScript文件时的两个属性defer和async
<script src="js1.js" defer></script>
<script src="js2.js" async></script>
defer 延迟脚本
立即下载,延迟执行
这个属性的用途是表明脚本在执行时不会影响页 面的构造。也就是说,脚本会被延迟到整个页面都解析完毕后再运行
HTML5 规范要求脚本按照它们出现的先后顺序执行,因此第一个延迟脚本会先于第二个延迟脚本执行,而这两个脚本会先于 DOMContentLoaded 事件执行。
在现实当中,延迟脚本并不一定会按照顺序执行,也不一定会在 DOMContentLoaded 事件触发 前执行,因此最好只包含一个延迟脚本
IE4、Firefox 3.5、Safari 5 和 Chrome 是最早支持 defer 属性的浏览器。其他浏览器会忽略这个属 性,像平常一样处理脚本。为此,把延迟脚本放在页面底部仍然是最佳选择
async 异步脚本
立即下载,立即执行
指定 async 属性的目的是不让页面等待两个脚本下载和执行,从而异步加载页面其他内容
标记为 async 的脚本并不保证按照指定它们的先后顺序执行
异步脚本一定会在页面的 load 事件前执行,但可能会在 DOMContentLoaded 事件触发之前或之 后执行。
支持异步脚本的浏览器有 Firefox 3.6、Safari 5 和 Chrome