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 相关文章推荐
javascript入门·对象属性方法大总结
Oct 01 Javascript
firefox插件Firebug的使用教程
Jan 02 Javascript
mailto的使用技巧分享
Dec 21 Javascript
JavaScript中“基本类型”之争小结
Jan 03 Javascript
js函数中onmousedown和onclick的区别和联系探讨
May 19 Javascript
JavaScript实现班级随机点名小应用需求的具体分析
May 12 Javascript
jQuery功能函数详解
Feb 01 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
Feb 22 Javascript
javascript稀疏数组(sparse array)和密集数组用法分析
Dec 28 Javascript
js 作用域和变量详解
Feb 16 Javascript
Vue 应用中结合vux使用微信 jssdk的方法
Aug 28 Javascript
vue-i18n结合Element-ui的配置方法
May 20 Javascript
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
PHP中的MYSQL常用函数(php下操作数据库必备)
2010/09/12 PHP
PHP开发工具ZendStudio下Xdebug工具使用说明详解
2013/11/11 PHP
解决Laravel5.x的php artisan migrate数据库迁移创建操作报错SQLSTATE[42000]
2020/04/06 PHP
Jquery中显示隐藏的实现代码分析
2011/07/26 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
JavaScript进阶练习及简单实例分析
2016/06/03 Javascript
jQuery通过ajax请求php遍历json数组到table中的代码(推荐)
2016/06/12 Javascript
十大 Node.js 的 Web 框架(快速提升工作效率)
2017/06/30 Javascript
JavaScript实现的可变动态数字键盘控件方式实例代码
2017/07/15 Javascript
vue ssr 指南详读
2018/06/29 Javascript
React SSR样式及SEO的实践
2018/10/22 Javascript
JavaScrip数组去重操作实例小结
2019/06/20 Javascript
js实现简单抽奖功能
2020/11/24 Javascript
Python安装第三方库及常见问题处理方法汇总
2016/09/13 Python
基于PyQt4和PySide实现输入对话框效果
2019/02/27 Python
程序员的七夕用30行代码让Python化身表白神器
2019/08/07 Python
Django框架序列化与反序列化操作详解
2019/11/01 Python
python使用paramiko实现ssh的功能详解
2020/03/06 Python
python脚本定时发送邮件
2020/12/22 Python
详解Python中的Lock和Rlock
2021/01/26 Python
CSS3中的transform属性进行2D和3D变换的基本用法
2016/05/12 HTML / CSS
快速创建 HTML5 Canvas 电信网络拓扑图的示例代码
2018/03/21 HTML / CSS
美国在线家装零售商:Build.com
2016/09/02 全球购物
Square Off美国/加拿大:世界上最聪明的国际象棋棋盘
2018/12/06 全球购物
英国蜡烛、蜡烛配件和家居香氛购买网站:Yankee Candle
2018/12/12 全球购物
MyHeritage美国:家族史研究和DNA测试的领先服务
2019/05/27 全球购物
数控机械专业个人的自我评价
2014/01/02 职场文书
简单通用的简历自我评价
2014/09/21 职场文书
2014小学生国庆65周年演讲稿
2014/09/21 职场文书
党员教师群众路线思想汇报范文
2014/10/28 职场文书
实习单位指导教师评语
2014/12/30 职场文书
python - asyncio异步编程
2021/04/06 Python
浅谈Python 中的复数问题
2021/05/19 Python
mysq启动失败问题及场景分析
2021/07/15 MySQL
Python turtle编写简单的球类小游戏
2022/03/31 Python
Python何绘制带有背景色块的折线图
2022/04/23 Python