页面异步加载javascript文件
昨天听一同事说的异步加载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文件。
页面异步加载javascript文件的更多相关文章
- 两种动态加载JavaScript文件的方法
两种动态加载JavaScript文件的方法 第一种便是利用ajax方式,第二种是,动静创建一个script标签,配置其src属性,经过把script标签拔出到页面head来加载js,感乐趣的网友可以看 ...
- 谈谈异步加载JavaScript
前言 关于JavaScript脚本加载的问题,相信大家碰到很多.主要在几个点—— 1> 同步脚本和异步脚本带来的文件加载.文件依赖及执行顺序问题 2> 同步脚本和异步脚本带来的性能优化问题 ...
- 网页性能优化之异步加载js文件
一个网页的有很多地方可以进行性能优化,比较常见的一种方式就是异步加载js脚本文件.在谈异步加载之前,先来看看浏览器加载js文件的原理. 浏览器加载 JavaScript 脚本,主要通过<scri ...
- 异步加载js文件的方法
# 异步加载js文件 - js的加载默认是同步的,因为js是单线程执行,只能完成一件再执行下一件. - 一些外部引入的js文件可以因为文件太大,在加载资源的过程中会影响dom元素的加载,影响了用户体验 ...
- angularLoad(用以异步加载js文件)
angularLoad(用以异步加载js文件) 使用方法: 1.执行命令 下载 lib npm install angular-load --save 2.index.html引用js <scr ...
- 在HTML页面中加载js文件和css文件的方法
1.在HTML页面加载js文件的方法: function loadScriptFile(filePath){ var script = document.createElement("scr ...
- 异步加载js文件的方法总结
方法一,jQuery.getScript HTML 代码: 代码如下 复制代码 <button id="go">Run</button><div cl ...
- 如何用Mvc实现一个列表页面-异步加载
在接触Mvc后,开始有点觉得很累,什么都要自己做,完全没有WebForm的易用性: 大概用了一个月左右的时候,越用用顺手,就习惯了MVC的这种开发方式,灵活,简洁: 当初学习MVC,网上看资料,都是讲 ...
- javascript 动态加载javascript文件
/* loadFile(data, callback): 动态加载js文件 data: 存放需要加载的js文件的url("url" || ["url", &qu ...
随机推荐
- Linux Mint 17 + 小米WIFI创建手机热点
转载:http://www.pppei.net/blog/post/690 亲测可行! 我的系统是linux mint 17.1 64位,所用wifi位小米WIFI. 以下是原文: 此方法在linux ...
- 【转】Linux写时拷贝技术(copy-on-write)
http://www.cnblogs.com/biyeymyhjob/archive/2012/07/20/2601655.html 源于网上资料 COW技术初窥: 在Linux程序中,fork()会 ...
- lintcode:交换链表当中两个节点
题目 给你一个链表以及两个权值v1和v2,交换链表中权值为v1和v2的这两个节点.保证链表中节点权值各不相同,如果没有找到对应节点,那么什么也不用做. 注意事项 你需要交换两个节点而不是改变节点的权值 ...
- Android核心分析之十四Android GWES之输入系统
Android输入系统 依照惯例,在研究Android输入系统之前给出输入系统的本质描述:从哲学的观点来看,输入系统就是解决从哪里来又将到哪里去问题.输入的本质上的工作就是收集用户输入信息 ...
- 1.BOM学习
1.bom.html <html> <head> <title>bom演示</title> <script type="text/jav ...
- dreamweaver cs5中提示扩展管理不可用
下载: Extension Manager CS5.5 for Windows 安装后重启就能用了
- BeautifulSoup 安装使用
Linux环境 1. 安装 方法一: 下载:http://www.crummy.com/software/BeautifulSoup/bs4/download/4.2/ 解压:tar -xzvf be ...
- ubuntu下安装与测试mysql
1.在决定安装mysql之前,要先确定系统是否已经安装mysql. 输入: 1 mysql 结果:说明尚未安装mysql The program 'mysql' is currently notins ...
- [置顶] 炎炎夏日,给你一次极爽的开发体验!——统一开发环境功能升级优化,正式上线V2.0!
作为中国移动应用运行托管平台(MM应用引擎)的开发部署工具,统一开发环境(UDE)在原HTML5跨平台开发功能基础上优化升级,新增跨平台编译(Android/iOS)和云端托管服务,正式上线2.0版本 ...
- jdbc框架 commons-dbutils+google guice+servlet 实现一个例子
最近闲着无聊,于是看了一下jdbc框架 commons-dbutils与注入google guice. 我就简单的封装了一下代码,效率还是可以的.... jdbc+google guice+servl ...