jquery.parser源码解析

/**
 * parser - jQuery EasyUI
 * 
 * Licensed under the GPL terms
 * To use it on other terms please contact us
 *
 * Copyright(c) 2009-2012 stworthy [ [e-mail] ] 
 * 
 */

/**
 * 解析器,首先会根据自定义的控件的名称,去页面上去查找使用了这个控件名称定义了类的元素,如:控件"linkbutton"将会去页面上查找$(".easyui-linkbutton"),查找完之后,就会去加载对应的控件模块。
 * 每个模块加载的时候都会在jquery的fn上扩展了一控件名字作为名称的方法属性,如"linkbutton"控件注册了"$.fn.linkbutton = function(options){...}"
 * 控件加载全部加载完成之后就针对每一个html元素调用控件的构造方法,于是一个控件就在页面上渲染完成了. *
 *
 */
(function($){
   $.parser = {
      auto: true,
      onComplete: function(context){},
      //下面是支持的插件的名字,例如linkbutton代表".easyui-linkbutton"
      plugins:['linkbutton','menu','menubutton','splitbutton','progressbar',
             'tree','combobox','combotree','numberbox','validatebox','searchbox',
             'numberspinner','timespinner','calendar','datebox','datetimebox','slider',
             'layout','panel','datagrid','propertygrid','treegrid','tabs','accordion','window','dialog'
      ],
      parse: function(context){
         //解析使用easyui样式定义的html元素
         //存储查找到引用了指定名称控件的名字和对应的元素,如:[{name:"linkbutton",jq:$(".easyui-linkbutton")]
         var aa = [];
         for(var i=0; i<$.parser.plugins.length; i++){
            //控件的名字,如:linkbutton
            var name = $.parser.plugins[i];
            //选中使用的控件的html元素集合,如:$(".easyui-linkbutton")
            var r = $('.easyui-' + name, context);
            if (r.length){
               if (r[name]){
                  //如果已经加载过当前的控件了,这里应该是每个控件加载完成之后,都会在jquery的fn上扩展一个以改控件名称命名的属性
                  r[name]();
               } else {
                  //将控件的名字和查找到使用了该控件的html元素保存到数组中,如[{name:"linkbutton",jq:$(".easyui-linkbutton")]
                  aa.push({name:name,jq:r});
               }
            }
         }
         if (aa.length && window.easyloader){
            var names = [];//存储查找到的所有控件的名字,如:["linkbutton"]
            for(var i=0; i<aa.length; i++){
               names.push(aa[i].name);
            }
            //使用easyloader组件去加载这些使用到了的控件
            easyloader.load(names, function(){
               //加载完所有控件后,依次调用每个控件对应的方法
               for(var i=0; i<aa.length; i++){
                  var name = aa[i].name;
                  var jq = aa[i].jq;
                  //下面的调用形式例子:$(".easyui-linkbutton")["linkbutton"]()
                  jq[name]();
               }
               $.parser.onComplete.call($.parser, context);
            });
         } else {
            $.parser.onComplete.call($.parser, context);
         }
      }
   };
   $(function(){
      //如果没有加载过easyloader.js文件的话,就执行方法$.parser.parse(),因为easyloader.js脚本里已经向页面初始化函数里注册了加载并执行parser脚本和方法:$.parser.parse()
      if (!window.easyloader && $.parser.auto){
         //如果已经加载过easyloader.js脚本的话,下面的函数是不会被执行的
         $.parser.parse();
      }
   });
})(jQuery);