今天我们来看在写此UI框架时的第一个js文件，本来想将所有的基本的js都写入此文件，但由于使用jquery而导致这个文件很小，不算注释仅有几十行大小。先上代码，然后我们再来一块说明每个函数在整个框架中的用处。
1 /** 2 * Neter核心库 3 * @author Ly 4 * @date 2012/11/14 5 * @version 1.0 6 * @namespace Neter 7 */ 8 ;(function(window, $) { 9 // 插件相对于调用页面的路径 10 var __path__ = '', 11 __skin__ = '天空蓝', 12 __color__ = '#135BA5'; 13 14 /** 15 * @static 16 * @class 17 * @name Neter 18 */ 19 window.Neter = window.Neter || {}; 20 21 $.extend(Neter, { 22 /** 23 * @type String 24 * @constant 25 * @name Neter.version 26 */ 27 version : '1.0', 28 29 /** 30 * 创建命名空间 31 * @static 32 * @function 33 * @name Neter.namespace 34 * @param {String} namespace 以点分隔的命令空间字符串，即要转换的字符串。 35 * @return {Neter} 返回Neter引用 36 */ 37 namespace : function(namespace) { 38 var arg = arguments, ns = null, nsArray, obj; 39 40 for (var i = 0; i < arg.length; i++) { 41 nsArray = arg[i].split('.'); 42 obj = nsArray[0]; 43 44 eval('if (typeof ' + obj + ' == "undefined") { ' + obj + ' = {}; } ns = ' + obj + ';'); 45 46 for (var j = 1; j < nsArray.length; j++) { 47 ns[nsArray[j]] = ns[nsArray[j]] || {}; 48 ns = ns[nsArray[j]]; 49 } 50 } 51 52 return this; 53 }, 54 /** 55 * 日志输入，如果开启Firebug，则直接使用控制台进行输出。若在控制台中无法调用console则不输出日志 56 * @static 57 * @function 58 * @name Neter.log 59 * @param {*} msg 要输出的信息，可以是字符串，也可以是一个dom元素，字符串中支持点位符：%d/%s/%o 60 * @param {*} [param] 用来填充参数msg点位符的参数，当有此参数时必须传递type参数。 61 * @param {String} [type='log'] 输出类型，默认为log，支持info/warning/error等 62 */ 63 'log' : function(msg, param, type) { 64 var arg = [].slice.call(arguments, 0); 65 66 type = arg.length < 2 ? 'log' : arg.pop(); 67 68 typeof console === 'object' && typeof console[type] === 'function' && console[type].apply(console, arg); 69 70 return this; 71 }, 72 /** 73 * 设置或获取插件路径 74 * @static 75 * @function 76 * @name Neter.path 77 * @param {String} [path] 插件路径，省略则为获取插件路径 78 * @return {String|Neter} 若有path参数，则返回Neter引用，否则返回插件路径。 79 */ 80 path : function(path) { 81 if (path) { 82 __path__ = path; 83 } else { 84 return __path__; 85 } 86 return this; 87 }, 88 /** 89 * 拷贝属性 90 * @static 91 * @function 92 * @name Neter.apply 93 * @param {Object} aim 目标对象 94 * @param {Object} source 源对象 95 * @param {Object} [defaults] 默认对象，即用这个对象中的值覆盖源对象中同名属性 96 * @param {Array} [mask] 需要屏蔽掉的属性，即不需要拷贝的属性 97 * @return {Object} 返回目标对象aim 98 */ 99 apply : function(aim, source, defaults, mask) { 100 aim = aim || {}; 101 source = source || {}; 102 defaults = defaults || {}; 103 mask = mask || []; 104 105 for (var p in source) { 106 if (~$.inArray(p, mask)) { continue; } 107 aim[p] = source[p]; 108 } 109 110 for (var p in defaults) { 111 if (~$.inArray(p, mask)) { continue; } 112 aim[p] = defaults[p]; 113 } 114 115 return aim; 116 }, 117 /** 118 * 获取或保存当前系统中正在使用的皮肤 119 * @static 120 * @function 121 * @name Neter.skin 122 * @param {String} [name='天空蓝'] 要保存的皮肤名称，省略则获取 123 * @return {String|Neter} 若提供color参数则返回Neter引用，否则返回当前的皮肤名称 124 */ 125 skin : function(name) { 126 if (name) { 127 __skin__ = name; 128 } else { 129 return __skin__; 130 } 131 return this; 132 }, 133 /** 134 * 设置获取保存当前皮肤的基准色 135 * @static 136 * @function 137 * @name Neter.color 138 * @param {Number|String} [color='#135BA5'] 要设置的颜色，省略则获取 139 * @return {String|Neter} 若提供color参数则返回Neter引用，否则返回当前的颜色值 140 */ 141 color : function(color) { 142 if (typeof color === 'undefined') { 143 return __color__; 144 } else { 145 __color__ = color; 146 } 147 return this; 148 } 149 }); 150 })(window, $);
这个文件中的Neter对象很简单，都是些静态方法。
1、version属性，这个就不用说，仅是用来表示当前框架的版本号，可以直接忽略掉。
2、namespace方法，这个是用来生成一个命名空间，主要是用于像是比较长的命名空间的创建，如果很短的话也就无所谓了，咱们自己写也可以，如果像是：Neter.Plugin.Grid.View这种借助于Neter.namespace就很简单了。
1 // 普通方式 2 window.Neter = window.Neter || {}; 3 Neter.Plugin = Neter.Plugin || {}; 4 Plugin.Grid = Plugin.Grid || {}; 5 Grid.View = Grid.View || {}; 6 7 // Neter.namespace 8 Neter.namespace('Neter.Plugin.Grid.View');
3、log方法，此方法其实就是对控制台对象console的一个封装，仅是当控制台未打开时调用console不至于报错。在这里还有一个小问题，即在chrome下console中的方法调用，仅能是console本身调用，也就是说不能写成console.apply(null, [1,2,3]);，但在firebug下就无所谓了。
4、path方法，用来设置或获取当前框架的路径，这个主要是用在框架中使用到图片的地方。
5、apply方法，用来拷贝对象的属性与方法，与jquery中的extend相似，唯一多的就是最后一个参数mask，这个参数是一个数组，数组中的每个元素都是表示在拷贝中要忽略掉的key。
6、skin方法，用来设置与获取当前系统中使用的皮肤，这个在Neter.Skin类中会调用。
7、color方法，用来设置与获取当前系统中使用的基准色，这个基准色也是由Neter.Skin类来控制。
总之，这个文件的功能很少，没有一些实质性的东西，接下来的内容才会涉及到UI相关的。