Yepnope. js-asynchronously load resource files

Document directory

• Yepnope loads jquery instances

Yepnope. js is a js script that can selectively load resource files asynchronously Based on Input conditions. It can load only the js/css required by users on the page.

Typical code example

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

When Modernizr. geolocation is true, load the yep item, that is, "normal. js". Otherwise, load the nope item-you can load multiple files at the same time.

What is the difference between yepnope and the existing xxx script loader?

I personally think that the two main points are as follows:

• Javascript and css can be processed simultaneously.
• Ability to load according to conditions

All yepnope Parameters

Yepnope ([{
Test:/* boolean (ish)-the expression you want to check for authenticity */,
Yep:/* array (of strings) | this parameter is loaded when string-test is set to true */,
Nope:/* array (of strings) | this attribute is loaded when string-test is set to false */,
Both:/* array (of strings) | string-loaded under any circumstances */,
Load:/* array (of strings) | string-load under any circumstances */,
Callback:/* function (testResult, key) | object {key: fn} execute the corresponding method when a url is loaded successfully */,
Complete:/* the function is loaded and executed */
},...]);

The parameters here can be array or object, which is useful when loading multiple resource files.

Yepnope loads jquery instances

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();
    });
  }
}]);

This code asynchronously loads jquery and jquery. plugin. js, and even makes a backup for jquery loading failure.

Link: http://www.ooso.net/archives/591