正文

页面异步加载javascript文件

IP云
IP云V管理员/4 阅读
10/27
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

昨天听一同事说的异步加载js文件，可以提高页面加载速度。具体方法如下：
(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = 'http://www.test.com/myjs.js';
  (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);
})();
我亲自试验了，果然有效果，不过有一个问题。如果要加载多个的话，而且他们有相互依赖的关系，比如js1文件要调用js2里的函数或使用js2里的框架，那就有问题了。可能会报未定义的错误。因为他们是异步加载的，顺序不能保证。
解决的方法一个是把他们合并到一个文件里，另一个是吧那个需要先加载的 ga.async 设置为false。当然最好的还是第一个方法。
后来搜了下这里有更详细的介绍。
http://lifesinger.org/blog/2010/03/script-async-attribute/

还有就是最好在文件的最后才加载js文件。