javascript动态加载js文件主流浏览器兼容版
一、代码示例：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>动态加载JS文件</title>
</head>
<body>
<button id="btn" onclick="loanScript('test.js'),callback">加载js文件</button>
<script type="text/javascript"> function callback(){
console.log("script load complete");
loadSuccess();
}
function loanScript(url,callbackFun){
var script = document.createElement("script");
script.type = "text/javascript";
//兼容IE浏览器
if(script.readyState){
script.onreadystatechange = function(){
if(script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange = null;
callbackFun();
}
}
}else{//其他浏览器
script.onload = function(){
callbackFun();
}; } script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}
</script>
</body>
</html>
注意除了Firefox和Opera保证脚本文件按照代码顺序加载，其他浏览器不保证文件按照你指定的顺序加载，可通过串联操作保证文件的加载次序代码如下
window.onload=function(){
loadScript("file1.js",function(){
loadScript("file2.js",function(){
loadScript("file3.js",function(){
alert("all js document are loaded");
});
});
});
}
javascript动态加载js文件主流浏览器兼容版的更多相关文章
- JavaScript动态加载js文件
/********************************************************************* * JavaScript动态加载js文件 * 说明: * ...
- 动态加载js文件是异步的
动态加载js文件是异步的. 今天调试一个错误,一个js方法各种调不到. 原因是因为所调方法的js文件是动态加载进来的. <script type="text/javascript&qu ...
- 动态加载JS文件，并根据JS文件的加载状态来执行自己的回调函数
动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数, 在很多场景下,我们需要在动态加载JS文件的时候,根据加载的状态来进行后续的操作,需要在JS加载成功后,执行另一方法,这个方法是依托在加 ...
- ExtJS4.x动态加载js文件
动态加载js文件是ext4.x的一个新特性,可以有效的减少浏览器的压力,提高渲染速度.如动态加载自定义组件 1.在js/extjs/ux目录下,建立自定义组件的js文件. 2.编写MyWindow.j ...
- Ext JS学习第十天 Ext基础之动态加载JS文件（补充）
此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...
- 详谈LABJS按需动态加载js文件
为了提高页面的打开和加载速度,我们经常把JS文件放在页面的尾部,但是有些JS必须放在页面前面,这样就会增加页面的加载时间:于是出现了按需动态加载的概念,这个概念就是当页面需要用到这个JS文件或者CSS ...
- js动态加载js文件(js异步加载之性能优化篇)
1.[基本优化] 将所有需要的<script>标签都放在</body>之前,确保脚本执行之前完成页面渲染而不会造成页面堵塞问题,这个大家都懂. 2.[合并JS代码,尽可能少的使 ...
- 动态加载js文件
由于最近在弄echarts,关于地图类的效果,但是全国地图整体的js文件太大了,加载很耗费资源,所以要根据不同省份加载不同地区的js地图, 于是就想的比较简单, var script = docume ...
- 如何动态加载js文件，$.getScript()方法的使用
有时候我们需要动态在页面中加载js文件,jquery封装了getScript()方法,不用自己再创建标签了. 写法: $.getScript("name.js",function( ...
随机推荐
- 创建xml树
XMLElement 节点XMLDocument 节点的CUID操作 XMLNode 抽象类 操作节点 (XMLElement XMLDocument ) XElement xElement = ne ...
- Boosting
Boosting is a greedy alogrithm. The alogrithm works by applying the weak learner sequentially to wei ...
- 33 个 2017 年必须了解的 iOS 开源库
本文翻译自Medium,原作者为Pawe? Bia?ecki 照片版权:(Unsplash/Markus Pe) 你好,iOS 开发者们!我的名字叫 Pawe?,我是一个独立 iOS 开发者,并且是 ...
- 小程序BindTap快速连续点击页面跳转多次
原因: 手机端点击Tap基础事件解决300ms延迟 解决办法: success 里面加一个延迟300ms能解决 setTimeout goRob(e) { const that = this retu ...
- X-Window/GNOME/KDE的关系
名称 开发者 开发年份 许可证 语言 说明 X-Window MIT 1984 X-Window是一个C/S架构的桌面框架,KDE和GNOME都是其基础上的具体实现 KDE Trolltech ...
- AI的新增功能（定义图案）（描边渐变）（图像描摹）5.1
1.定义图案:打开一个AI素材文件如图: 选择工具拖拽选择这个图案,选择“对象”“图案”“建立”完成图案的建立 此时会弹出图案选项对话框,改变拼贴类型,图案宽高,份数,不透明度,单击"完成“ ...
- Mac上搭建nginx教程
1.安装Homebrew ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/in ...
- Win10系列：JavaScript写入和读取文件
正如上面的内容中所提到的,文件保存选取器用于保存文件,通过Windows.Storage.Pickers命名空间中的FileSavePicker类的pickSaveFileAsync函数可以向指定的文 ...
- where的顺序对运行的影响--无影响
2.表连接的时候,大表与小表的顺序是哪个在前.3.在多表连接时,是表与表先连接起来,再执行对单表的限制条件where条件:还是先执行单表的限制where条件,再进行表连接?4.多表连接时,如4个表,我 ...
- 尚学堂java答案解析 第一章
本答案为本人个人编辑,仅供参考,如果读者发现,请私信本人或在下方评论,提醒本人修改 一.选择题: 1.C 解析:java为了安全,中并没有引入C语言的指针概念. 2.AD 解析:B:Java先通过ja ...