javascript loadScript异步加载脚本示例讲解


Posted in Javascript onNovember 14, 2013

一、语法:
loadScript(url[,callback])
或者
loadScript(settings)
二、settings支持的参数:
url:脚本路径
async:是否异步,默认false(HTML5)
charset:文件编码
cache:是否缓存,默认为true
success:加载成功后执行的函数,优先执行callback。
三、调用举例:

//loadScript(url[,callback])
loadScript(“http://code.jquery.com/jquery.js”);
loadScript(“http://code.jquery.com/jquery.js”,function(){
console.log(1)
});
//loadScript(settings)
loadScript({“url”:”http://code.jquery.com/jquery.js”,”async”:false,”charset”:”utf-8″,”cache”:false});
loadScript({“url”:”http://code.jquery.com/jquery.js”,”async”:false,”charset”:”utf-8″,”success”:function(){
console.log(2)
}});
//或者你可以酱紫:
//loadScript(settings[,callback])
loadScript({“url”:”http://code.jquery.com/jquery.js”,”async”:false,”charset”:”utf-8″},function(){
console.log($)
});

四、源代码:
function loadScript(url,callback) {
var head = document.head || document.getElementsByTagName(“head”)[0] || document.documentElement,
script,
options,if (typeof url === “object”) {
options = url;
url = undefined;
}
s = options || {};
url = url || s.url;
callback = callback || s.success;
script = document.createElement(“script”);
script.async = s.async || false;
script.type = “text/javascript”;
if (s.charset) {
script.charset = s.charset;
}
if(s.cache === false){
url = url+( /\?/.test( url ) ? “&” : “?” )+ “_=” +(new Date()).getTime();
}
script.src = url;
head.insertBefore(script, head.firstChild);
if(callback){
document.addEventListener ? script.addEventListener(“load”, callback, false) : script.onreadystatechange = function() {
if (/loaded|complete/.test(script.readyState)) {
script.onreadystatechange = null
callback()
}
}
}
}
Javascript 相关文章推荐
javascript开发技术大全 第4章 直接量与字符集
Jul 03 Javascript
JavaScript之Getters和Setters 平台支持等详细介绍
Dec 07 Javascript
关于jQuery中的each方法(jQuery到底干了什么)
Mar 05 Javascript
使用iframe window的scroll方法控制iframe页面滚动
Mar 05 Javascript
JavaScript检测鼠标移动方向的方法
May 22 Javascript
使用jquery获取url及url参数的简单实例
Jun 14 Javascript
Jquery根据浏览器窗口改变调整大小的方法
Feb 07 Javascript
解决微信小程序中转换时间格式IOS不兼容的问题
Feb 15 Javascript
微信小程序mpvue点击按钮获取button值的方法
May 29 Javascript
vue 子组件watch监听不到prop的解决
Aug 09 Javascript
在Angular项目使用socket.io实现通信的方法
Jan 05 Javascript
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
MyEclipse取消验证Js的两种方法
Nov 14 #Javascript
使用JS CSS去除IE链接虚线框的三种方法
Nov 14 #Javascript
javascript unicode与GBK2312(中文)编码转换方法
Nov 14 #Javascript
javascript按位非运算符的使用方法
Nov 14 #Javascript
javascript Array.prototype.slice的使用示例
Nov 14 #Javascript
js取消单选按钮选中示例代码
Nov 14 #Javascript
js实现目录定位正文示例
Nov 14 #Javascript
You might like
将博客园(cnblogs.com)数据导入到wordpress的代码
2013/01/06 PHP
深入浅析PHP7.0新特征(五大新特征)
2015/10/29 PHP
PHP大文件分割上传 PHP分片上传
2017/08/28 PHP
thinkphp5.1框架模板布局与模板继承用法分析
2019/07/19 PHP
Nigma vs Liquid BO3 第一场2.14
2021/03/10 DOTA
JavaScript 原型继承之构造函数继承
2011/08/26 Javascript
JQuery $.each遍历JavaScript数组对象实例
2014/09/01 Javascript
JS基于面向对象实现的拖拽功能示例
2016/12/20 Javascript
十个免费的web前端开发工具详细整理
2017/09/18 Javascript
微信小程序实现日历效果
2018/12/28 Javascript
vue路由对不同界面进行传参及跳转的总结
2019/04/20 Javascript
使用localStorage替代cookie做本地存储
2019/09/25 Javascript
详解vite2.0配置学习(typescript版本)
2021/02/25 Javascript
[03:37]2016完美“圣”典 风云人物:Mikasa专访
2016/12/07 DOTA
[03:35]2018年度DOTA2最佳辅助位选手5号位-完美盛典
2018/12/17 DOTA
Python实现求最大公约数及判断素数的方法
2015/05/26 Python
python遍历序列enumerate函数浅析
2017/10/17 Python
python实现百度语音识别api
2018/04/10 Python
详解python列表生成式和列表生成式器区别
2019/03/27 Python
Django框架用户注销功能实现方法分析
2019/05/28 Python
python-tornado的接口用swagger进行包装的实例
2019/08/29 Python
tensorflow自定义激活函数实例
2020/02/04 Python
Python中zip()函数的解释和可视化(实例详解)
2020/02/16 Python
python3通过udp实现组播数据的发送和接收操作
2020/05/05 Python
基于Python实现粒子滤波效果
2020/12/01 Python
pandas按照列的值排序(某一列或者多列)
2020/12/13 Python
城野医生官方海外旗舰店:风靡亚洲毛孔收敛水
2018/04/26 全球购物
Parfume Klik丹麦:香水网上商店
2018/07/10 全球购物
2014年大学生自我评价
2014/01/19 职场文书
简历中的自我评价怎么写
2014/01/29 职场文书
新年团拜会主持词
2014/04/02 职场文书
实验室的标语
2014/06/20 职场文书
教师党员个人剖析材料
2014/09/29 职场文书
毕业论文答辩稿范文
2015/06/23 职场文书
日本动漫十大公认神作:第五现已全网禁播,《死亡笔记》在榜
2022/03/18 日漫
《LOL》“克隆大作战”久违归来 幻灵战队皮肤上线
2022/04/03 其他游戏