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 编程引入命名空间的方法与代码
Aug 13 Javascript
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
Mar 18 Javascript
js 文本滚动效果的实例代码
Aug 17 Javascript
js截取字符串的两种方法及区别详解
Nov 05 Javascript
angular简介和其特点介绍
Jan 29 Javascript
jquery插件jquery.confirm弹出确认消息
Dec 22 Javascript
简单掌握JavaScript中const声明常量与变量的用法
May 21 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
Jun 02 Javascript
从零开始学习Node.js系列教程二:文本提交与显示方法
Apr 13 Javascript
浅谈Node异步编程的机制
Oct 18 Javascript
修改vue+webpack run build的路径方法
Sep 01 Javascript
JQuery实现ajax请求的示例和注意事项
Dec 10 jQuery
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操作csv文件代码实例汇总
2014/09/22 PHP
php格式输出文件var_export函数实例
2014/11/15 PHP
javascript parseInt 函数分析(转)
2009/03/21 Javascript
javascript 导出数据到Excel(处理table中的元素)
2009/12/18 Javascript
javascript 学习笔记(onchange等)
2010/11/14 Javascript
33个优秀的 jQuery 图片展示插件分享
2012/03/14 Javascript
关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别
2015/10/12 Javascript
体验jQuery和AngularJS的不同点及AngularJS的迷人之处
2016/02/02 Javascript
jQuery实现百叶窗焦点图动画效果代码分享(附源码下载)
2016/03/14 Javascript
vue的一个分页组件的示例代码
2017/12/25 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
Vue axios设置访问基础路径方法
2018/09/19 Javascript
js实现移动端轮播图
2020/12/21 Javascript
js获取对象,数组所有属性键值(key)和对应值(value)的方法示例
2019/06/19 Javascript
jQuery/JS监听input输入框值变化实例
2019/10/17 jQuery
vue使用prop可以渲染但是打印台报错的解决方式
2019/11/13 Javascript
Django框架中处理URLconf中特定的URL的方法
2015/07/20 Python
Appium Python自动化测试之环境搭建的步骤
2019/01/23 Python
numpy和pandas中数组的合并、拉直和重塑实例
2019/06/28 Python
python实现代码统计器
2019/09/19 Python
python+Django+pycharm+mysql 搭建首个web项目详解
2019/11/29 Python
详解python的变量缓存机制
2021/01/24 Python
WEB控件可以激发服务端事件,请谈谈服务端事件是怎么发生并解释其原理?自动传回是什么?为什么要使用自动传回?
2012/02/21 面试题
电子商务专员岗位职责
2013/12/11 职场文书
电大毕业自我鉴定
2014/02/03 职场文书
优秀党务工作者事迹材料
2014/05/07 职场文书
初中学校军训方案
2014/05/09 职场文书
优秀员工推荐信
2014/05/10 职场文书
幽默自我介绍演讲稿
2014/08/21 职场文书
党支部党的群众路线对照检查材料
2014/09/24 职场文书
春晚观后感
2015/06/11 职场文书
奶茶店的创业计划书该怎么写?
2019/07/15 职场文书
考教师资格证不要错过的4个最佳时机
2019/07/17 职场文书
SQL Server数据定义——模式与基本表操作
2021/04/05 SQL Server
详解如何使用Node.js实现热重载页面
2021/05/06 Javascript
实现GO语言对数组切片去重
2022/04/20 Golang