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 相关文章推荐
7款吸引人眼球的jQuery/CSS3特效实例分享
Apr 25 Javascript
js中parseInt函数浅谈
Jul 31 Javascript
JQuery页面的表格数据的增加与分页的实现
Dec 10 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 Javascript
Js 获取、判断浏览器版本信息的简单方法
Aug 08 Javascript
JavaScript简单下拉菜单特效
Sep 13 Javascript
js返回顶部实例分享
Dec 21 Javascript
Angular2使用Guard和Resolve进行验证和权限控制
Apr 24 Javascript
vue左侧菜单,树形图递归实现代码
Aug 24 Javascript
koa router 多文件引入的方法示例
May 22 Javascript
微信小程序实现订单倒计时
Nov 01 Javascript
JS highcharts实现动态曲线代码示例
Oct 16 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 JS Ip地址及域名格式检测代码
2013/09/27 PHP
php按字符无乱码截取中文的方法
2015/03/27 PHP
php实现留言板功能
2017/03/05 PHP
laravel实现按月或天或小时统计mysql数据的方法
2019/10/09 PHP
在Z-Blog中运行代码[html][/html](纯JS版)
2007/03/25 Javascript
载入jQuery库的最佳方法详细说明及实现代码
2012/12/28 Javascript
js监听滚动条滚动事件使得某个标签内容始终位于同一位置
2014/01/24 Javascript
Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
Angularjs编写KindEditor,UEidtor,jQuery指令
2015/01/28 Javascript
JavaScript使用indexOf获得子字符串在字符串中位置的方法
2015/04/06 Javascript
TableSort.js表格排序插件使用方法详解
2017/02/10 Javascript
浅谈webpack下的AOP式无侵入注入
2017/11/12 Javascript
jQuery解析json格式数据示例
2018/09/01 jQuery
深入理解vue-class-component源码阅读
2019/02/18 Javascript
微信小程序实现一张或多张图片上传(云开发)
2019/09/25 Javascript
Vue指令实现OutClick的示例
2020/11/16 Javascript
Python的Asyncore异步Socket模块及实现端口转发的例子
2016/06/14 Python
Python的string模块中的Template类字符串模板用法
2016/06/27 Python
Python2与python3中 for 循环语句基础与实例分析
2017/11/20 Python
对python判断是否回文数的实例详解
2019/02/08 Python
PyQT5 QTableView显示绑定数据的实例详解
2019/06/25 Python
浅谈opencv自动光学检测、目标分割和检测(连通区域和findContours)
2020/06/04 Python
哪些是python中web开发框架
2020/06/17 Python
pandas apply使用多列计算生成新的列实现示例
2021/02/24 Python
HTML5 Video标签的属性、方法和事件汇总介绍
2015/04/24 HTML / CSS
美国运动鞋和服装网上商店:YCMC
2018/09/15 全球购物
七年级数学教学反思
2014/01/22 职场文书
网络编辑职责
2014/03/01 职场文书
法律进社区实施方案
2014/03/21 职场文书
大学生评语大全
2014/04/18 职场文书
学校督导评估方案
2014/06/10 职场文书
网吧消防安全责任书
2014/07/29 职场文书
秋季运动会演讲稿
2014/09/16 职场文书
大学生社会实践活动总结报告
2015/05/06 职场文书
Angular CLI发布路径的配置项浅析
2021/03/29 Javascript
解析redis hash应用场景和常用命令
2021/08/04 Redis