html5 让我兴奋的一个最大的原因是, 它里面实现的新功能和新特征都是我们长久以来一直期待的. 比如, 我以前一直在使用 placeholders, 但以前必须要用 JavaScript 实现. 而 HTML5 里给 JavaScript 标记提供的 async 属性, 使 JavaScript 能异步加载执行. 之前我需要各种的 JavaScript 插件来实现这种功能, 但现在这个新属性能让我们轻松的实现异步加载.
async - HTML 代码
真的非常简单, 就像下面这样:
<script async src="siteScript.js" onload="myInit()"></script>
事实上, 如果你是个有严谨精神的程序员, 你应该在你 90% 以上的 SCRIPT 标记上使用 async 属性.
defer - HTML 代码
还有一个跟 async 属性相似的 defer 属性:
<script defer src="siteScript.js" onload="myInit()"></script>
跟 async 属性的在语法上非常相似.
async & defer - 不同之处
这篇 webKit 博客将 defer 和 async 之间的不同之处解释的非常清楚:
浏览器对标记有 async 属性或 defer 属性的 scripts 会立即加载并解析, 同时也会支持依赖于这个脚本进行初始化的 onload 事件. async 属性和 defer 属性的不同之处在于何时执行这个脚本. 标注有 async 属性的 Script 会在下载完成后即可执行, 不需要等待 Windows 的 load 事件. 这意味着标记有 async 属性的脚本并不一定会按在页面中嵌入的顺序执行. 而标记有 defer 属性的脚本却一定会按它们在页面上的顺序依次执行. 执行会在解析完全完成后开始, 但会在 document 的 DOMContentLoaded 事件之前.
支持 async 和 defer 属性的浏览器有哪些?
引用 Safari 博客上的话:
WebKit 引擎的浏览器 (谷歌浏览器和 Safari 浏览器). 火狐浏览器从 3.6 版开始支持 async 和 defer 属性. IE 也很早就支持 defer 属性, 但对 async 属性不支持, 在 IE9 中支持 onload 属性.
async 太有用了!
看到各浏览器实现 async 功能着实让我非常高兴. 浏览器网站页面时被 JavaScript 卡住的确是个很大的问题, async 属性的异步加载, 执行能力一定会让网站的页面速度增色不少.
来源: http://www.webhek.com/post/javascript-async.html