jquery.parser源码解析

/** * parser - jQuery EasyUI * * Licensed under the GPL terms * To use it on other terms please contact us * * Copyright(c) 2009-2012 stworthy [ stworthy@gmail.com ] * */ /** * 解析器,首先会根据自定义的控件的名称,去页面上去查找使用了这个控件名称定义了类的元素,如:控件"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);