2012年4月6日星期五

yepnope.js 异步加载资源文件

yepnope.js 异步加载资源文件



典型代码示例

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加载失败的情况做了一个备用处理。



TAG: