yepnope.js 异步加载资源文件


Posted in Javascript onSeptember 08, 2011

典型代码示例

yepnope({ 
test : Modernizr.geolocation, 
yep : 'normal.js', 
nope : ['polyfill.js', 'wrapper.js'] 
});

当Modernizr.geolocation为真时,加载yep项也就是”normal.js”,否则加载nope项——可以同时加载多个文件。

yepnope和现有的xxx script loader有什么区别?
个人认为主要 是这两点:

可以同时处理javascript以及css
能够按条件加载
yepnope的全部参数

yepnope([{ 
test : /* boolean(ish) - 你要检查真伪的表达式 */, 
yep : /* array (of strings) | string - test为true时加载这项 */, 
nope : /* array (of strings) | string - test为false时加载这项 */, 
both : /* array (of strings) | string - 什么情况下都加载 */, 
load : /* array (of strings) | string - 什么情况下都加载 */, 
callback : /* function ( testResult, key ) | object { key : fn } 当某个url加载成功时执行相应的方法 */, 
complete : /* function 都加载完成了执行这个方法 */ 
}, ... ]);

这里的参数都可以是array或者object,在加载多个资源文件的时候有用。

yepnope加载jquery的实例

yepnope([{ 
load: 'http:/­/ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js', 
complete: function () { 
if (!window.jQuery) { 
yepnope('local/jquery.min.js'); 
} 
} 
}, { 
load: 'jquery.plugin.js', 
complete: function () { 
jQuery(function () { 
jQuery('div').plugin(); 
}); 
} 
}]);

这段代码异步加载了jquery和jquery.plugin.js,甚至还对jquery加载失败的情况做了一个备用处理。
Javascript 相关文章推荐
JS隐藏参数post传值实例
Apr 18 Javascript
pace.js页面加载进度条插件
Sep 29 Javascript
全面理解JavaScript中的闭包
May 12 Javascript
Node.js实现兼容IE789的文件上传进度条
Sep 02 Javascript
layer弹出层中H5播放器全屏出错的解决方法
Feb 21 Javascript
解决vue router使用 history 模式刷新后404问题
Jul 19 Javascript
浅谈VUE单页应用首屏加载速度优化方案
Aug 28 Javascript
vue拖拽排序插件vuedraggable使用方法详解
Aug 21 Javascript
js/jQuery实现全选效果
Jun 17 jQuery
vue实现导航标题栏随页面滚动渐隐渐显效果
Mar 12 Javascript
jQuery实现简单三级联动效果
Sep 05 jQuery
vue中如何自定义右键菜单详解
Dec 08 Vue.js
jquery绑定原理 简单解析与实现代码分享
Sep 06 #Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
Sep 05 #Javascript
JQuery扩展插件Validate—4设置错误提示的样式
Sep 05 #Javascript
JQuery扩展插件Validate 3通过参数设置错误信息
Sep 05 #Javascript
JQuery扩展插件Validate 2通过参数设置验证规则
Sep 05 #Javascript
JQuery扩展插件Validate 1 基本使用方法并打包下载
Sep 05 #Javascript
JQuery扩展插件Validate 5添加自定义验证方法
Sep 05 #Javascript
You might like
一个可以删除字符串中HTML标记的PHP函数
2006/10/09 PHP
一个比较简单的PHP 分页分组类
2009/12/10 PHP
计算php页面运行时间的函数介绍
2013/07/01 PHP
smarty模板中使用get、post、request、cookies、session变量的方法
2014/04/24 PHP
thinkphp学习笔记之多表查询
2014/07/28 PHP
Thinkphp3.2实用篇之计算型验证码示例
2017/02/09 PHP
php图形jpgraph操作实例分析
2017/02/22 PHP
PHP7使用ODBC连接SQL Server2008 R2数据库示例【基于thinkPHP5.1框架】
2019/05/06 PHP
JavaScript库 开发规则
2009/01/31 Javascript
ExtJS 2.0实用简明教程 之Ext类库简介
2009/04/29 Javascript
Jquery ui css framework
2010/06/28 Javascript
浅析LigerUi开发中谨慎载入common.css文件
2013/07/09 Javascript
jQuery焦点图切换特效代码分享
2015/09/15 Javascript
JS常见问题之为什么点击弹出的i总是最后一个
2016/01/05 Javascript
javascript插件开发的一些感想和心得
2016/02/28 Javascript
jQuery siblings()用法实例详解
2016/04/26 Javascript
jquery自定义插件——window的实现【示例代码】
2016/05/06 Javascript
window.open不被拦截的简单实现代码(推荐)
2016/08/04 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
2017/10/09 Javascript
解决使用vue.js路由后失效的问题
2018/03/17 Javascript
jquery实现自定义树形表格的方法【自定义树形结构table】
2019/07/12 jQuery
layui表格 返回的数据状态异常的解决方法
2019/09/10 Javascript
JS实现时间校验的代码
2020/05/25 Javascript
[36:20]KG vs SECRET 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/19 DOTA
用python写的一个wordpress的采集程序
2016/02/27 Python
Python基于matplotlib绘制栈式直方图的方法示例
2017/08/09 Python
python如何修改装饰器中参数
2018/03/20 Python
数组保存为txt, npy, csv 文件, 数组遍历enumerate的方法
2018/07/09 Python
浅谈python 导入模块和解决文件句柄找不到问题
2018/12/15 Python
matplotlib实现区域颜色填充
2019/03/18 Python
Python3变量与基本数据类型用法实例分析
2020/02/14 Python
python 实现"神经衰弱"翻牌游戏
2020/11/09 Python
Deichmann英国:德国鞋类零售商
2021/01/30 全球购物
自荐书范文
2013/12/08 职场文书
检讨书范文
2015/01/27 职场文书
TaiShan 200服务器安装Ubuntu 18.04的图文教程
2022/06/28 Servers