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

赞 (0)

相关推荐

  • yepnope.js使用详解及示例分享

    yepnope.js的一个典型实例: yepnope({ test : Modernizr.geolocation, yep : 'normal.js', nope : ['polyfill.js', 'wrapper.js'] }); 此实例表示如果Modernizr.geolocation为真的时候加载normal.js,为假则加载polyfill.js及wrapper.js. yepnope完整语法: yepnope([{ test : /* boolean(ish) 输入条件 */, y

  • yepnope.js 异步加载资源文件

    典型代码示例 复制代码 代码如下: yepnope({ test : Modernizr.geolocation, yep : 'normal.js', nope : ['polyfill.js', 'wrapper.js'] }); 当Modernizr.geolocation为真时,加载yep项也就是"normal.js",否则加载nope项--可以同时加载多个文件. yepnope和现有的xxx script loader有什么区别? 个人认为主要 是这两点: 可以同时处理jav

  • 详解JS异步加载的三种方式

    一:同步加载 我们平时使用的最多的一种方式. <script src="http://yourdomain.com/script.js"></script> <script src="http://yourdomain.com/script.js"></script> 同步模式,又称阻塞模式,会阻止浏览器的后续处理,停止后续的解析,只有当当前加载完成,才能进行下一步操作.所以默认同步执行才是安全的.但这样如果js中有输

  • turn.js异步加载实现翻书效果

    本文实例为大家分享了turn.js异步加载实现翻书效果的具体代码,供大家参考,具体内容如下 1.阅读翻书js /** * 电子翻书 */ //var width = 1080; //var height = 1680; var width = "10rem"; var height = "15.2rem"; window.onload = function () { //预加载 //loading(18,1); initData(); } function getQ

  • 浅析JS异步加载进度条

    浅析JS异步加载进度条

    展现效果: 1) 当点击Load的时候,模拟执行异步加载. 浏览器被遮挡. 进度条出现. 实现思路: 1.当用户点击load button执行异步请求. 调用方法 出现加载条 2.怎么实现进度条呢? 1) 在document.body 新增一个div.覆盖浏览器. 设置背景会灰色. z-index = 999. 加载的时候让用户无法修改界面值 2) 在document.body 新增一个动态的div. 代码实现: Main.html: <!DOCTYPE html> <html>

  • Java加载资源文件时的路径问题的解决办法

    加载资源文件比较常用的有两种: 一.用ClassLoader,说到这里就不得不提一下ClassLoader的分类,java内置的ClassLoader主要有三种, 第一种是根类加载器(bootstrap class loader),用C++来编写,负责将一些关键的Java类,如java.lang.Object和其他一些运行时代码先加载进内存中. 所负责加载的包:BootStrp------>JRE/lib/rt.jar 第二种是扩展类加载器(ExtClassLoader),由java类编写,负责

  • 点评js异步加载的4种方式

    js异步加载的4种方式,点评开始. 方案1:$(document).ready <!DOCTYPE html> <html> <head> <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script> <script type="text/javascript"&g

  • JS异步加载的三种实现方式

    js加载的缺点:加载工具方法没必要阻塞文档,过多js加载会影响页面效率,一旦网速不好,那么整个网站将等待js加载而不进行后续渲染等工作. 有些工具方法需要按需加载,用到再加载,不用不加载,. 默认正常模式下下,JS是同步加载的,即优先加载JS,只有当JS文件下载完,dom和css才开始加载,当某些时候我们需要JS异步加载,我们可以通过以下方式来设置异步加载,不同情况下选取不同方式即可 1.defer:defer JS异步下载,dom结构解析完(标签 + 样式(内容不一定下载完))才异步执行 仅I

  • Spring实战之FileSystemResource加载资源文件示例

    本文实例讲述了Spring实战之FileSystemResource加载资源文件.分享给大家供大家参考,具体如下: 一 代码 package lee; import org.springframework.core.io.FileSystemResource; import org.dom4j.*; import org.dom4j.io.*; import java.util.*; import java.util.*; public class FileSystemResourceTest

  • springBoot如何动态加载资源文件

    目录 springBoot动态加载资源文件 构造DynamicLoadPropertySource 添加到Enviroment springBoot静态资源动态加载 举例说明 springBoot动态加载资源文件 在实际项目中资源信息如果能够动态获取在修改线上产品配置时极其方便,下面来展示一个加载动态获取资源的案例,而不是加载写死的properties文件信息. 首先构造PropertySource,然后将其添加到Enviroment中. 构造DynamicLoadPropertySource

  • js异步加载的三种解决方案

    默认情况javascript是同步加载的,也就是javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,对于一些意义不是很大的javascript,如果放在页头会导致加载很慢的话,是会严重影响用户体验的. (1) defer,只支持IE defer属性的定义和用法(我摘自w3school网站) defer 属性规定是否对脚本执行进行延迟,直到页面加载为止. 有的 javascript 脚本 document.write 方法来创建当前的文档内容,其他脚本

随机推荐