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中全局对象的parseInt()方法使用介绍
Dec 19 Javascript
css与javascript跨浏览器兼容性总结
Sep 15 Javascript
JavaScript中最简洁的编码html字符串的方法
Oct 11 Javascript
Javascript实现可旋转的圆圈实例代码
Aug 04 Javascript
js文字横向滚动特效
Nov 11 Javascript
jquery插件jquery.LightBox.js实现点击放大图片并左右点击切换效果(附demo源码下载)
Feb 25 Javascript
jQuery基于$.ajax设置移动端click超时处理方法
May 14 Javascript
js修改onclick动作的四种方法(推荐)
Aug 18 Javascript
详解Vue中状态管理Vuex
May 11 Javascript
用Webpack构建Vue项目的实践
Nov 07 Javascript
记一次webpack3升级webpack4的踩坑经历
Jun 12 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
Dec 03 Javascript
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
用PHP书写安全的脚本代码
2012/02/05 PHP
Thinkphp3.2简单解决多文件上传只上传一张的问题
2017/09/26 PHP
php 获取xml接口数据的处理方法
2018/05/31 PHP
javascript中"/"运算符常见错误
2010/10/13 Javascript
Jquery下attr和removeAttr的使用方法
2010/12/28 Javascript
jQuery的attr与prop使用介绍
2013/10/10 Javascript
一行命令搞定node.js 版本升级
2014/07/20 Javascript
分享28款免费实用的 JQuery 图片和内容滑块插件
2014/12/15 Javascript
一款基于jQuery的图片场景标注提示弹窗特效
2015/01/05 Javascript
javascript中sort() 方法使用详解
2015/08/30 Javascript
JavaScript代码里的判断小结
2016/08/22 Javascript
jQuery包裹节点用法完整示例
2016/09/13 Javascript
jquery广告无缝轮播实例
2017/01/05 Javascript
js验证手机号、密码、短信验证码代码工具类
2020/06/24 Javascript
@ResponseBody 和 @RequestBody 注解的区别
2017/03/08 Javascript
浅谈Vue.js 关于页面加载完成后执行一个方法的问题
2019/04/01 Javascript
重学JS之显示强制类型转换详解
2019/06/30 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
2019/08/20 Javascript
使用原生JS实现滚轮翻页效果的示例代码
2020/05/31 Javascript
python安装与使用redis的方法
2016/04/19 Python
python3获取当前文件的上一级目录实例
2018/04/26 Python
Python常见数据结构之栈与队列用法示例
2019/01/14 Python
Python如何在单元测试中给对象打补丁
2020/08/03 Python
Python如何急速下载第三方库详解
2020/11/02 Python
python基于爬虫+django,打造个性化API接口
2021/01/21 Python
阿里健康大药房:阿里自营网上药店
2017/08/01 全球购物
德国购买门票网站:ADticket.de
2019/10/31 全球购物
有趣的睡衣和礼物:LazyOne
2019/11/27 全球购物
环境科学专业大学生自荐信格式
2013/09/21 职场文书
医院实习介绍信
2014/01/12 职场文书
单位租房协议书样本
2014/10/30 职场文书
个人工作保证书
2015/02/28 职场文书
2015年国税春训心得体会
2015/03/09 职场文书
2016春节慰问信范文
2015/03/25 职场文书
2015年体育教师个人工作总结
2015/05/12 职场文书
2016年感恩父亲节活动总结
2016/04/01 职场文书