1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > yepnope.js 异步加载资源文件

yepnope.js 异步加载资源文件

时间:2021-09-27 10:39:22

相关推荐

yepnope.js 异步加载资源文件

yepnope.js是一个能够根据输入条件来选择性异步加载资源文件的js脚本,可以在页面上仅加载用户需要的js/css。

yepnope的优点:

可以同时处理javascript以及css

能够按条件加载

Gzip后只有1.6K比大多数的资源加载器都小

可以加载CSS及JS

yepnope通过了作者能找到的所有的浏览器的测试

yepnope完全分离资源加载和执行,这样你可以控制资源的执行顺序

提供友好的API和促进资源的逻辑组合

模块化设计,你可以自己扩充功能(见稍后的Prefixes及filters)

鼓励按需加载资源

集成在 Modernizr 中

默认总是按照资源列表(你所提供的文件列表顺序)顺序执行

可处理资源回退(fallback),且仍优先并行下载依赖的脚本

yepnope的不足:

并不总是最快的,像labjs等优化后可能加载速度优于yepnope,但需要根据你的实际情况考虑使用哪个加载器

需要给资源设置一定的缓存头(这一点很重要)

并不像RequireJS等类库有自己的生成工具及丰富的API,yepnope仅实现了基本加载器功能

默认总是按照你提供的资源列表顺序执行,这一点有可能会影响速度

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

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

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

yepnope使用实例:

直接传入字符串

yepnope( '/url/to/your/script.js' );

传入一个Object对象

yepnope( {load : '/url/to/your/script.js'});

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。