One of the Learning Easyui: Easyloader analysis and use

Http://www.cnblogs.com/haogj/archive/2013/04/22/3036685.html

The script library is used to load a whole bunch of stylesheets and script files, and in Easyui, in addition to being loaded in the usual way, provides a way to load using Easyloader.

This component was created primarily to load components on demand. Under what circumstances should it be used?

1. You think one-time import Easyui core min js and css too big
2. You only use a few of the components of Easyui.
3. You want to use one of these components, but you don't know that the component is dependent on those components.

If you have the above three cases, then you are recommended to use Easyloader. It can help you solve these problems.

Easyloader is used to help us automatically load the required script files and style files, so that we only need to reference the jquery script and the Easyloader script in the page, and Easyloader can help us analyze the dependencies of the modules and load the dependencies first. The module loads well and invokes the parse module to parse the page. The tags that start with class Easyui are converted into Easyui controls.

Let's use the Messager module as an example to load the required modules using Easyloader.

Our page can simply be written to the following content. Note that the usual style sheets and a whole bunch of script references are not required.

<! DOCTYPE html>
Watch it! Only jquery scripts and Easyloader scripts do not have a whole bunch of styles and other script files.
Load is used to describe the module that needs to be loaded, which is a function defined in Easyloader, the first parameter of the function is the name of the module to be loaded, and the second parameter is the callback function after the load succeeds. This is used to prompt for a successful load.
Load-loaded modules have two formats, either a single module represented by a string, or an array of strings, loaded with multiple modules at the same time.
There are two types of name, one string and one string array, so that you can load more than one plugin at a time, calling the Add method to add an  if (typeof name = = ' String ') {    add (name);} else {for    (var i = 0; i < name.length; i++) {        Add (Name[i]);}    }
Easyloader.load also has an alias using defined on the Window object, as follows:
Therefore, the loaded code can also be written in this way.
using ("Messager", function () {    alert ("Load succeeded!") ");});
Once the load is successful, we can use the loaded modules in the code.
The page also uses class to illustrate a button, where class= "Easyui-linkbutton" is used, and Easyloader can also help us parse the special class name in the element and use the module directly on the page.
Easyloader will find the script in the Plugins subfolder, and the style sheet in the Themes folder in the folder where it is located. So you need to keep the files in the right place.
However, Easyloader also provides a base property that specifies the starting point for finding plugins and scripts.
Jquery-easyui root directory, when loading Easyloader, will automatically change depending on where you place it  
In addition to base, there are several important properties
Base: '. ',//This property is to load JS, record folder path  theme: ' Default ',//default theme  Css:true,    
For example, if you want to use a Chinese language pack, you can use the following. You will see that the text in the button of the Cue box has been converted from OK to "OK".
Easyloader.locale = "ZH_CN"; using ("Messager", function () {    alert ("Load succeeded!") ");});
Related reading:
KALLLX's Easyloader.js source reading
Resources Download:
Click to download the sample file
One of the Learning Easyui: Easyloader analysis and use