1 /*
  2     源码作者: 石不易(Louis Shi)
  3     联系方式: http://www.shibuyi.net
  4     ===================================================================================================
  5     程序名称: JavaScript 封装库 BETA 2.0 版
  6     迭代版本: BETA 1.0
  7     功能总数: 50 个
  8     新增总数: 6 个
  9     删除总数: 0 个
 10     追加功能:
 11         1. 库方法: 设置与获取滚动条
 12         2. 库方法: 定位器筛选
 13         3. 库方法: 检测元素从属关系(直接从属)
 14         4. 库方法: 获取网页可视区尺寸
 15         5. 库方法: 禁止页面滚动(修正浏览器BUG)
 16         ...
 17     优化功能:
 18         1. 取消了“隶属方法”, 增加了“库方法”并与“特效”和“事件”组成集合, 封装库结构更加清晰
 19         2. 元素节点获取更加智能, 支持 class / name / tagName / id 在内的局部搜索
 20         3. 添加与删除元素节点更加方便容易, 支持 class / name / tagName / id 直接定位
 21         ...
 22     删除功能:
 23         无
 24 */
 25
 26 // 实例化封装库
 27 function $(_this) {
 28     return new Base(_this);
 29 }
 30
 31 // 封装库构造方法
 32 function Base(_this) {
 33     this.elements = [];
 34     if (typeof _this == 'object' && _this !== null) this.elements.push(_this);
 35 }
 36
 37 // 获取元素节点
 38 Base.prototype.getNodes = function () {
 39     if (this.elements.length == 0) return '没有任何节点对象';
 40     if (this.elements.length == 1) return this.elements[0];
 41     return this.elements;
 42 };
 43
 44 // 获取 id 元素节点
 45 Base.prototype.getId = function (ids) {
 46     if (ids instanceof Array) { // 集群
 47         for (var i in ids) {
 48             this.getId(ids[i]);
 49         }
 50     } else { // 单个
 51         var node = document.getElementById(ids);
 52         if (node === null) return this;
 53         for (var i =0; i < this.elements.length; i ++) {
 54             if (this.elements[i] == node) return this;
 55         }
 56         this.elements.push(node);
 57     }
 58     return this;
 59 };
 60
 61 // 获取 name 元素节点
 62 Base.prototype.getName = function (name, position) {
 63     var nodes = [], selector = [];
 64     if (typeof position != 'undefined') { // 局部
 65         selector = Base.positioner(position);
 66         if (selector instanceof Array) { // 集群
 67             for (var i = 0; i < selector.length; i ++) {
 68                 nodes.push(selector[i].getElementsByTagName('*'));
 69             }
 70         } else { // 单个
 71             if (typeof selector == 'object') nodes = selector.getElementsByTagName('*'); // 防止 IE 无法识别 name 属性
 72         }
 73     } else { // 全局
 74         nodes = document.getElementsByName(name);
 75     }
 76     for (var i = 0; i < nodes.length; i ++) {
 77         if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
 78             for (var j = 0; j < nodes[i].length; j ++) {
 79                 if (nodes[i][j].getAttribute('name') == name) this.elements.push(nodes[i][j]);
 80             }
 81         } else { // 单集群
 82             if (nodes[i].getAttribute('name') == name) this.elements.push(nodes[i]);
 83         }
 84     }
 85     return this;
 86 };
 87
 88 // 获取 tagName 元素节点
 89 Base.prototype.getTagName = function (tagName, position) {
 90     var nodes = [], selector = [];
 91     if (typeof position != 'undefined') { // 局部
 92         selector = Base.positioner(position);
 93         if (selector instanceof Array) { // 集群
 94             for (var i = 0; i < selector.length; i ++) {
 95                 nodes.push(selector[i].getElementsByTagName(tagName));
 96             }
 97         } else { // 单个
 98             if (typeof selector == 'object') nodes = selector.getElementsByTagName(tagName); // 防止 IE 无法识别 name 属性
 99         }
100     } else { // 全局
101         nodes = document.getElementsByTagName(tagName);
102     }
103     for (var i = 0; i < nodes.length; i ++) {
104         if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
105             for (var j = 0; j < nodes[i].length; j ++) {
106                 this.elements.push(nodes[i][j]);
107             }
108         } else { // 单集群
109             this.elements.push(nodes[i]);
110         }
111     }
112     return this;
113 };
114
115 // 获取 class 元素节点
116 Base.prototype.getClass = function (className, position) {
117     var nodes = [], selector = [];
118     if (typeof position != 'undefined') { // 局部
119         selector = Base.positioner(position);
120         if (selector instanceof Array) { // 集群
121             for (var i = 0; i < selector.length; i ++) {
122                 nodes.push(selector[i].getElementsByTagName('*'));
123             }
124         } else { // 单个
125             if (typeof selector == 'object') nodes = selector.getElementsByTagName('*'); // 防止 IE 无法识别 name 属性
126         }
127     } else { // 全局
128         nodes = $().getTagName('*').getNodes();
129     }
130     for (var i = 0; i < nodes.length; i ++) {
131         if (typeof nodes[i] == 'undefined') continue; // 兼容 IE 识别空元素
132         if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
133             for (var j = 0; j < nodes[i].length; j ++) {
134                 if (Base.hasClass(nodes[i][j], className)) this.elements.push(nodes[i][j]);
135             }
136         } else { // 单集群
137             if (Base.hasClass(nodes[i], className)) this.elements.push(nodes[i]);
138         }
139     }
140     return this;
141 };
142
143 // 获取与设置 innerHTML
144 Base.prototype.html = function (text) {
145     if (typeof text != 'undefined') { // 设置
146         for (var i = 0; i < this.elements.length; i ++) {
147             this.elements[i].innerHTML = text;
148         }
149     } else { // 获取
150         var html = [];
151         for (var i = 0; i < this.elements.length; i ++) {
152             html.push(this.elements[i].innerHTML);
153         }
154         if (html.length == 1) return html[0];
155         return html;
156     }
157     return this;
158 };
159
160 // 获取与设置 value (表单)
161 Base.prototype.value = function (text) {
162     if (typeof text != 'undefined') { // 设置
163         for (var i = 0; i < this.elements.length; i ++) {
164             if (typeof this.elements[i].value != 'undefined') this.elements[i].value = text;
165         }
166     } else { // 获取
167         var value = [];
168         for (var i = 0; i < this.elements.length; i ++) {
169             if (typeof this.elements[i].value != 'undefined') value.push(this.elements[i].value);
170         }
171         if (value.length == 1) return value[0];
172         return value;
173     }
174     return this;
175 };
176
177 // 获取与设置 CSS
178 Base.prototype.css = function (cssKey, cssValue) {
179     if (typeof cssValue != 'undefined' || cssKey instanceof Array) { // 设置
180         if (cssKey instanceof Array) { // 集群
181             var cssPattern = /^([a-z]+)\s*=\s*([\w\(\)\'\"\\\/\-#\.=%\s]+)$/i;
182             var _cssKey = '', _cssValue = '';
183             for (var i = 0; i < cssKey.length; i ++) {
184                 if (cssPattern.test(cssKey[i])) {
185                     _cssKey = cssPattern.exec(cssKey[i])[1];
186                     _cssValue = cssPattern.exec(cssKey[i])[2];
187                     for (var j = 0; j < this.elements.length; j ++) {
188                         this.elements[j].style[_cssKey] = _cssValue;
189                     }
190                 }
191             }
192         } else { // 单个
193             for (var i = 0; i < this.elements.length; i ++) {
194                 this.elements[i].style[cssKey] = cssValue;
195             }
196         }
197     } else { // 获取
198         var css = [];
199         for (var i = 0; i < this.elements.length; i ++) {
200             css.push(Tool.getStyle(this.elements[i], cssKey));
201         }
202         if (css.length == 1) return css[0];
203         return css;
204     }
205     return this;
206 };
207
208 // 添加 class 选择器
209 Base.prototype.addClass = function (className) {
210     if (className instanceof Array) { // 集群
211         for (var i = 0; i < className.length; i ++) {
212             this.addClass(className[i]);
213         }
214     } else { // 单个
215         var space = '';
216         for (var i = 0; i < this.elements.length; i ++) {
217             if (this.elements[i].className != '') space = ' ';
218             if (!Base.hasClass(this.elements[i], className)) this.elements[i].className += space + className;
219             space = '';
220         }
221     }
222     return this;
223 };
224
225 // 移除 class 选择器
226 Base.prototype.removeClass = function (className) {
227     if (className instanceof Array) { // 集群
228         for (var i = 0; i < className.length; i ++) {
229             this.removeClass(className[i]);
230         }
231     } else { // 单个
232         var elementNode = {};
233         for (var i = 0; i < this.elements.length; i ++) {
234             elementNode = this.elements[i];
235             if (Base.hasClass(elementNode, className)) {
236                 elementNode.className = elementNode.className.replace(new RegExp('\\s+' + className + '\\s+', 'i'), ' ');
237                 elementNode.className = elementNode.className.replace(new RegExp('(\\s+|^)' + className + '($|\\s+)', 'i'), '');
238             }
239         }
240     }
241     return this;
242 };
243
244 // 添加样式规则
245 Base.prototype.addRule = function (ruleName, ruleText, rulePosition, sheetIndex) {
246     if (ruleName instanceof Array) { // 集群
247         if (!ruleText instanceof Array || ruleName.length != ruleText.length) return this;
248         for (var i = 0; i < ruleName.length; i ++) {
249             this.addRule(ruleName[i], ruleText[i], rulePosition, sheetIndex);
250         }
251     } else { // 单个
252         var rule = Base.checkRule(rulePosition, sheetIndex);
253         if (typeof rule.sheet != 'undefined') {
254             Tool.addRule(rule.sheet, ruleName, ruleText, rule.position);
255         }
256     }
257     return this;
258 };
259
260 // 移除样式规则
261 Base.prototype.removeRule = function (rulePosition, ruleNumber, sheetIndex) {
262     var rule = Base.checkRule(rulePosition, sheetIndex, ruleNumber);
263     if (typeof rule.sheet != 'undefined') {
264         for (var i = 0; i < rule.number; i ++) {
265             Tool.removeRule(rule.sheet, rule.position);
266         }
267     }
268     return this;
269 };
270
271 /*
272     事件集合
273 */
274 // 鼠标 click 事件
275 Base.prototype.click = function (method, mode) {
276     if (typeof mode == 'undefined') mode = true;
277     if (typeof method == 'function') {
278         for (var i = 0; i < this.elements.length; i ++) {
279             mode ? Tool.loginEvent(this.elements[i], 'click', method) : Tool.logoutEvent(this.elements[i], 'click', method);
280         }
281     }
282     return this;
283 };
284
285 // 鼠标 mouseover 事件
286 Base.prototype.mouseover = function (method, mode) {
287     if (typeof mode == 'undefined') mode = true;
288     if (typeof method == 'function') {
289         for (var i = 0; i < this.elements.length; i ++) {
290             mode ? Tool.loginEvent(this.elements[i], 'mouseover', method) : Tool.logoutEvent(this.elements[i], 'mouseover', method);
291         }
292     }
293     return this;
294 };
295
296 // 鼠标 mouseout 事件
297 Base.prototype.mouseout = function (method, mode) {
298     if (typeof mode == 'undefined') mode = true;
299     if (typeof method == 'function') {
300         for (var i = 0; i < this.elements.length; i ++) {
301             mode ? Tool.loginEvent(this.elements[i], 'mouseout', method) : Tool.logoutEvent(this.elements[i], 'mouseout', method);
302         }
303     }
304     return this;
305 };
306
307 // 鼠标 mousedown 事件
308 Base.prototype.mousedown = function (method, mode) {
309     if (typeof mode == 'undefined') mode = true;
310     if (typeof method == 'function') {
311         for (var i = 0; i < this.elements.length; i ++) {
312             mode ? Tool.loginEvent(this.elements[i], 'mousedown', method) : Tool.logoutEvent(this.elements[i], 'mousedown', method);
313         }
314     }
315     return this;
316 };
317
318 // 鼠标 mousemove 事件
319 Base.prototype.mousemove = function (method, mode) {
320     if (typeof mode == 'undefined') mode = true;
321     if (typeof method == 'function') {
322         for (var i = 0; i < this.elements.length; i ++) {
323             mode ? Tool.loginEvent(this.elements[i], 'mousemove', method) : Tool.logoutEvent(this.elements[i], 'mousemove', method);
324         }
325     }
326     return this;
327 };
328
329 // 鼠标 mouseup 事件
330 Base.prototype.mouseup = function (method, mode) {
331     if (typeof mode == 'undefined') mode = true;
332     if (typeof method == 'function') {
333         for (var i = 0; i < this.elements.length; i ++) {
334             mode ? Tool.loginEvent(this.elements[i], 'mouseup', method) : Tool.logoutEvent(this.elements[i], 'mouseup', method);
335         }
336     }
337     return this;
338 };
339
340 // 鼠标 mousewheel 事件
341 Base.prototype.mousewheel = function (method, mode) {
342     if (typeof mode == 'undefined') mode = true;
343     if (typeof method == 'function') {
344         for (var i = 0; i < this.elements.length; i ++) {
345             Tool.mousewheel(this.elements[i], method, mode);
346         }
347     }
348     return this;
349 };
350
351 // 元素 load 事件
352 Base.prototype.load = function (method, mode) {
353     if (typeof mode == 'undefined') mode = true;
354     if (typeof method == 'function') {
355         for (var i = 0; i < this.elements.length; i ++) {
356             mode ? Tool.loginEvent(this.elements[i], 'load', method) : Tool.logoutEvent(this.elements[i], 'load', method);
357         }
358     }
359     return this;
360 };
361
362 // 元素 scroll 事件
363 Base.prototype.scroll = function (method, mode) {
364     if (typeof mode == 'undefined') mode = true;
365     if (typeof method == 'function') {
366         for (var i = 0; i < this.elements.length; i ++) {
367             mode ? Tool.loginEvent(this.elements[i], 'scroll', method) : Tool.logoutEvent(this.elements[i], 'scroll', method);
368         }
369     }
370     return this;
371 };
372
373 // 窗框 resize 事件
374 Base.prototype.resize = function (method, mode) {
375     if (typeof mode == 'undefined') mode = true;
376     if (typeof method == 'function') {
377         for (var i = 0; i < this.elements.length; i ++) {
378             mode ? Tool.loginEvent(this.elements[i], 'resize', method) : Tool.logoutEvent(this.elements[i], 'resize', method);
379         }
380     }
381     return this;
382 };
383
384 /*
385     特效集合
386 */
387 // 特效: 元素隐藏
388 Base.prototype.hide = function () {
389     for (var i = 0; i < this.elements.length; i ++) {
390         $(this.elements[i]).css('display', 'none');
391     }
392     return this;
393 };
394
395 // 特效: 元素显示
396 Base.prototype.show = function () {
397     for (var i = 0; i < this.elements.length; i ++) {
398         $(this.elements[i]).css('display', 'block');
399     }
400     return this;
401 };
402
403 // 特效: 鼠标移入移出 (下拉菜单)
404 Base.prototype.hover = function (overMethod, outMethod) {
405     this.mouseover(overMethod);
406     this.mouseout(outMethod);
407     return this;
408 };
409
410 // 特效: 定位居中
411 Base.prototype.center = function () {
412     var innerRectangle = Base.getInnerRectangle();
413     var scroll = Base.scroll();
414     var rectangle = {}, outerX = 0, outerY = 0;
415     for (var i = 0; i < this.elements.length; i ++) {
416         Base.setAbsolutePosition(this.elements[i]);
417         rectangle = Base.getRectangle(this.elements[i]);
418         outerX = (innerRectangle.innerWidth - rectangle.width) / 2;
419         outerY = (innerRectangle.innerHeight - rectangle.height) / 2;
420         if (outerX < 0) outerX = 0;
421         if (outerY < 0) outerY = 0;
422         $(this.elements[i]).css(['left = ' + ( scroll.scrollX + outerX) + 'px', 'top = ' + (scroll.scrollY + outerY) + 'px']);
423     }
424     return this;
425 };
426
427 // 特效: 遮罩锁屏
428 Base.prototype.lock = function () {
429     var screenLock = $().getId('screenLock').getNodes();
430     if (typeof screenLock == 'object') {
431         if (Base.trim($(Base.commentNode(screenLock)).html()) != 0) {
432             Base.removeElement(screenLock);
433             screenLock = Base.addElement('div', 'id = screenLock');
434         }
435     } else {
436         screenLock = Base.addElement('div', 'id = screenLock');
437     }
438     var scroll = Base.scroll();
439     $(document.documentElement).css('overflow', 'hidden');
440     Base.scroll(scroll.scrollX, scroll.scrollY);
441     var innerRectangle = Base.getInnerRectangle();
442     Base.setAbsolutePosition(screenLock);
443     $(screenLock).css([
444                                         'zIndex = 9998',
445                                         'left = ' + scroll.scrollX + 'px',
446                                         'top = ' + scroll.scrollY + 'px',
447                                         'width = ' + innerRectangle.innerWidth + 'px',
448                                         'height = ' + innerRectangle.innerHeight + 'px',
449                                         'backgroundColor = black',
450                                         'opacity = 0.4', // W3C
451                                         'filter = alpha(opacity = 40)'// IE 6/7/8
452                                     ]).show();
453     Base.fixed(screenLock);
454     return this;
455 };
456
457 // 特效: 清屏销锁
458 Base.prototype.unlock = function () {
459     var screenLock = $().getId('screenLock').getNodes();
460     if (typeof screenLock == 'object') {
461         var scroll = Base.scroll();
462         $(document.documentElement).css('overflow', 'auto');
463         Base.scroll(scroll.scrollX, scroll.scrollY);
464         $(screenLock).hide();
465     }
466     return this;
467 };
468
469 // 特效: 元素拖拽
470 Base.prototype.drag = function (mode) {
471     if (typeof mode == 'undefined') mode = true;
472     var down = function (event) {
473         _this = mode ? this : this.parentNode;
474         Base.setAbsolutePosition(_this);
475         if (Base.trim($(Base.commentNode(_this)).html()).length == 0) event.preventDefault();
476         var outerRectangle = Base.getOuterRectangle(_this);
477         var fixedX = event.clientX - outerRectangle.outerX;
478         var fixedY = event.clientY - outerRectangle.outerY;
479         var scroll = Base.scroll();
480         Tool.setCaptureIE(_this);
481         var move = function (event) {
482             var innerRectangle = Base.getInnerRectangle();
483             var rectangle = Base.getRectangle(_this);
484             var outerX = event.clientX - fixedX;
485             var outerY = event.clientY - fixedY;
486             var minX = scroll.scrollX, minY = scroll.scrollY;
487             var maxX = innerRectangle.innerWidth - rectangle.width + scroll.scrollX;
488             var maxY = innerRectangle.innerHeight - rectangle.height + scroll.scrollY;
489             if (outerX < minX) outerX = minX; else if (outerX > maxX) outerX = maxX;
490             if (outerY < minY) outerY = minY; else if (outerY > maxY) outerY = maxY;
491             $(_this).css(['left = ' + outerX + 'px', 'top = ' + outerY + 'px']);
492         };
493         $(document).mousemove(move);
494         var up = function () {
495             Tool.releaseCaptureIE(_this);
496             $(document).mousemove(move, false);
497             $(document).mouseup(up, false);
498         };
499         $(document).mouseup(up);
500     };
501     this.mousedown(down);
502     return this;
503 };
504
505 // 特效: 禁止元素溢出
506 Base.prototype.overflow = function () {
507     var scroll = Base.scroll();
508     var rectangle = {}, outerRectangle = {}, minX = 0, minY = 0, maxX = 0, maxY = 0, outerX = 0, outerY = 0;
509     var innerRectangle = Base.getInnerRectangle();
510     for (var i = 0; i < this.elements.length; i ++) {
511         Base.setAbsolutePosition(this.elements[i]);
512         rectangle = Base.getRectangle(this.elements[i]);
513         outerRectangle = Base.getOuterRectangle(this.elements[i]);
514         outerX = outerRectangle.outerX;
515         outerY = outerRectangle.outerY;
516         minX = scroll.scrollX;
517         minY = scroll.scrollY;
518         maxX = innerRectangle.innerWidth - rectangle.width + scroll.scrollX;
519         maxY = innerRectangle.innerHeight - rectangle.height + scroll.scrollY;
520         if (outerX < minX) outerX = minX; else if (outerX > maxX) outerX = maxX;
521         if (outerY < minY) outerY = minY; else if (outerY > maxY) outerY = maxY;
522         $(this.elements[i]).css(['left = ' + outerX + 'px', 'top = ' + outerY + 'px']);
523     }
524     return this;
525 };
526
527 /*
528     库方法集合
529 */
530 // 库方法: 重置滚动条
531 Base.scrollInitialization = function () {
532     Tool.scrollInitializationX();
533     Tool.scrollInitializationY();
534 };
535
536 // 库方法: 设置与获取滚动条
537 Base.scroll = function (x, y) {
538     if (typeof x == 'number' && typeof y == 'number') { // 设置
539         Tool.scrollX(x);
540         Tool.scrollY(y);
541     } else { // 获取
542         return {
543             scrollX : Tool.scrollX(),
544             scrollY : Tool.scrollY()
545         }
546     }
547 };
548
549 // 库方法: 检测 class 元素节点
550 Base.hasClass = function (elementNode, className) {
551     if ((new RegExp('(^|\\s+)' + className + '(\\s+|$)', 'i')).test(elementNode.className)) return true;
552     return false;
553 };
554
555 // 库方法: 检测样式规则
556 Base.checkRule = function (rulePosition, sheetIndex, ruleNumber) {
557     if (typeof sheetIndex == 'undefined' || isNaN(sheetIndex)) sheetIndex = 0;
558     var sheetObject = document.styleSheets[sheetIndex];
559     var rules = Tool.getRules(sheetObject);
560     if (rules == 0) {
561         rulePosition = 0;
562         ruleNumber = 0;
563     }
564     if (typeof rulePosition == 'undefined' || isNaN(rulePosition)) rulePosition = 0;
565     if (rules < rulePosition) rulePosition = rules;
566     if (typeof ruleNumber == 'undefined' || isNaN(ruleNumber)) ruleNumber = 1;
567     if (rules < ruleNumber) ruleNumber = rules;
568     if (rules - rulePosition < ruleNumber) ruleNumber = rules - rulePosition;
569     return {
570         position : rulePosition,
571         sheet : sheetObject,
572         number : ruleNumber
573     }
574 };
575
576 // 库方法: 字符串截取
577 Base.substring = function (string, index) {
578     if (typeof string != 'string') return string;
579     if (string.indexOf(index) != -1) string = string.replace(index, '');
580     return string;
581 };
582
583 // 库方法: 屏蔽两边空格
584 Base.trim = function (string) {
585     if (typeof string != 'string') return string;
586     var leftPattern = /^([\s\t]+)/, rightPattern = /([\s\t]+)$/;
587     if (leftPattern.test(string)) string = string.replace(leftPattern, '');
588     if (rightPattern.test(string)) string = string.replace(rightPattern, '');
589     return string;
590 };
591
592 // 库方法: 屏蔽空白文本节点
593 Base.spaceNode = function (elementNode) {
594     if (typeof elementNode != 'object') return elementNode;
595     var childs = elementNode.childNodes;
596     var pattern = /^[\s\t]+$/;
597     for (var i = 0; i < childs.length; i ++) {
598         if (childs[i].nodeType == 3 && pattern.test(childs[i].nodeValue)) elementNode.removeChild(childs[i]);
599     }
600     return elementNode;
601 }
602
603 // 库方法: 屏蔽注释节点
604 Base.commentNode = function (elementNode) {
605     if (typeof elementNode != 'object') return elementNode;
606     var childs = elementNode.childNodes;
607     var position = '';
608     if (elementNode.id != '') {
609         position = elementNode.id;
610     } else if (elementNode.className != '') {
611         position = 'class = ' + elementNode.className;
612     } else {
613         position = 'tagName = ' + elementNode.tagName;
614     }
615     var comments = $().getTagName('!', position).getNodes();
616     if (comments instanceof Array) { // 兼容 IE
617         for (var i = 0; i < comments.length; i ++) {
618             elementNode.removeChild(comments[i]);
619         }
620     }
621     for (var j = 0; j < childs.length; j ++) {
622         if (childs[j].nodeType == 8) elementNode.removeChild(childs[j]);
623     }
624     return elementNode;
625 };
626
627 // 库方法: 定位器筛选
628 Base.positioner = function (position) {
629     var namePattern = /^name\s*=\s*(\w+)$/i;
630     var tagNamePattern = /^tag(Name)?\s*=\s*(\w+)$/i;
631     var classPattern = /^class(Name)?\s*=\s*(\w+)$/i;
632     var idPattern = /^id\s*=\s*(\w+)$/i;
633     var selector = [];
634     if (namePattern.test(position)) { // name
635         position = namePattern.exec(position)[1];
636         selector = $().getName(position).getNodes();
637     } else if (tagNamePattern.test(position)) { // tagName
638         position = tagNamePattern.exec(position)[2];
639         selector = $().getTagName(position).getNodes();
640     } else if (classPattern.test(position)) { // class
641         position = classPattern.exec(position)[2];
642         selector = $().getClass(position).getNodes();
643     } else if (idPattern.test(position)) { // id
644         position = idPattern.exec(position)[1];
645         selector = $().getId(position).getNodes();
646     } else { // id
647         selector = $().getId(position).getNodes();
648     }
649     return selector;
650 }
651
652 // 库方法: 添加属性
653 Base.addAttribute = function (elementNode, attributes) {
654     if (attributes instanceof Array) {
655         for (var i = 0; i < attributes.length; i ++) {
656             this.addAttribute(elementNode, attributes[i]);
657         }
658     } else {
659         var attributePattern = /^([a-z]+)\s*=\s*([\w\-\\\/=\s\';\.:\"\)\(]+)$/i;
660         var attributeKey = '', attributeValue = '';
661         if (attributePattern.test(attributes)) {
662             attributeKey = attributePattern.exec(attributes)[1];
663             attributeValue = attributePattern.exec(attributes)[2];
664             if (attributeKey == 'style') { // CSS IE 6/7 特殊处理
665                 var cssPattern = /^([a-z]+)\s*:\s*([\w\(\)\'\"\\\/\-#\.=%\s]+)$/i;
666                 var cssKey = '', cssValue = '';
667                 if (/(;\s*)/.test(attributeValue)) { // 集群
668                     attributeValue = attributeValue.replace(/(;\s*)/g, '|');
669                     var css = attributeValue.split('|');
670                     for (var i = 0; i < css.length; i ++) {
671                         if (cssPattern.test(css[i])) {
672                             cssKey = cssPattern.exec(css[i])[1];
673                             cssValue = cssPattern.exec(css[i])[2];
674                             $(elementNode).css(cssKey, cssValue);
675                         }
676                     }
677                 } else { // 单个
678                     if (cssPattern.test(attributeValue)) {
679                         cssKey = cssPattern(attributeValue).exec(attributeValue)[1];
680                         cssValue = cssPattern(attributeValue).exec(attributeValue)[2];
681                         $(elementNode).css(cssKey, cssValue);
682                     }
683                 }
684             } else {
685                 elementNode.setAttribute(attributeKey, attributeValue);
686             }
687         }
688     }
689
690 };
691
692 // 库方法: 创建元素节点
693 Base.addElement = function (elementName, attributes, html, parentElement) {
694     if (typeof parentElement == 'undefined' && typeof parentElement != 'string' && typeof parentElement != 'object') parentElement = document.body;
695     if (typeof parentElement == 'string') parentElement = Base.positioner(parentElement);
696     var elementNode = document.createElement(elementName);
697     if (typeof html != 'undefined') $(elementNode).html(html);
698     if (typeof attributes != 'undefined') Base.addAttribute(elementNode, attributes);
699     if (parentElement instanceof Array) { // 集群
700         for (var i = 0; i < parentElement.length; i ++) {
701             parentElement[i].appendChild(elementNode);
702         }
703     } else { // 单个
704         parentElement.appendChild(elementNode);
705     }
706     return elementNode;
707 };
708
709 // 库方法: 删除元素节点
710 Base.removeElement = function (attributes, parentElement) {
711     if (typeof parentElement == 'string') parentElement = Base.positioner(parentElement);
712     if (attributes instanceof Array) { // 集群
713         for (var i = 0; i < attributes.length; i ++) {
714             this.removeElement(attributes[i], parentElement);
715         }
716     } else { // 单个
717         elementNode = typeof attributes == 'object' ? attributes : Base.positioner(attributes);
718         if (elementNode instanceof Array) { // 集群
719             var sevedNode = [];
720             for (var i = 0; i < elementNode.length; i ++) {
721                 sevedNode = elementNode;
722                 this.removeElement(elementNode[i], parentElement);
723                 elementNode = sevedNode;
724             }
725         } else { // 单个
726             if (typeof parentElement == 'undefined') parentElement = elementNode.parentNode;
727             if (parentElement instanceof Array) { // 集群
728                 for (var i = 0; i < parentElement.length; i ++) {
729                     if (typeof parentElement[i] == 'object' && Base.hasChildNode(parentElement[i], elementNode)) parentElement[i].removeChild(elementNode);
730                 }
731             } else { // 单个
732                 if (typeof parentElement == 'object' && Base.hasChildNode(parentElement, elementNode)) parentElement.removeChild(elementNode);
733             }
734         }
735     }
736 };
737
738 // 库方法: 检测元素从属关系(直接从属)
739 Base.hasChildNode = function (parentElement, elementNode) {
740     var childs = parentElement.childNodes;
741     for (var i = 0; i < childs.length; i ++) {
742         if (childs[i] == elementNode) return true;
743     }
744     return false;
745 };
746
747 // 库方法: 获取元素大小尺寸
748 Base.getRectangle = function (elementNode) {
749     var width = 0, height = 0, display = '', _this = {};
750     _this = $(elementNode);
751     width = _this.css('width');
752     height = _this.css('height');
753     display = _this.css('display');
754     if (width == 'auto' || height == 'auto') {
755         if (display == 'none') _this.show();
756         width = elementNode.offsetWidth;
757         height = elementNode.offsetHeight;
758     }
759     width = this.substring(width, 'px');
760     height = this.substring(height, 'px');
761     return {
762         width : width,
763         height : height
764     };
765 };
766
767 // 库方法: 获取元素外边距尺寸
768 Base.getOuterRectangle = function (elementNode) {
769     this.setAbsolutePosition(elementNode);
770     var outerX = 0, outerY = 0, display = '', _this = {};
771     _this = $(elementNode);
772     outerX = _this.css('left');
773     outerY = _this.css('top');
774     display = _this.css('display');
775     if (outerX == 'auto' || outerY == 'auto') {
776         if (display == 'none') _this.show();
777         outerX = elementNode.offsetLeft;
778         outerY = elementNode.offsetTop;
779     }
780     outerX = this.substring(outerX, 'px');
781     outerY = this.substring(outerY, 'px');
782     return {
783         outerX : outerX,
784         outerY : outerY
785     };
786 };
787
788 // 库方法: 获取网页可视区尺寸
789 Base.getInnerRectangle = function () {
790     var innerWidth = Tool.getInnerWidth();
791     var innerHeight = Tool.getInnerHeight();
792     return {
793         innerWidth : innerWidth,
794         innerHeight : innerHeight
795     };
796 };
797
798 // 库方法: 设置元素绝对定位
799 Base.setAbsolutePosition = function (elementNode) {
800     if ($(elementNode).css('position') != 'absolute') {
801         $(elementNode).css(['position = absolute', 'left = 0', 'top = 0']);
802     }
803 };
804
805 // 库方法: 禁止页面滚动(修正浏览器BUG)
806 Base.fixed = function (elementNode) {
807     // IE 禁止方式
808     $(elementNode).mousedown(function () {
809         $(elementNode).mousemove(function (event) {
810             event.preventDefault();
811         });
812     });
813     // Chrome 禁止方式
814     $(elementNode).mousewheel(function (event) {
815         event.preventDefault();
816     });
817 };

  1 /*
  2     源码作者: 石不易(Louis Shi)
  3     联系方式: http://www.shibuyi.net
  4     ===================================================================================================
  5     程序名称: JavaScript 工具库(跨浏览器兼容) BETA 2.0 版
  6     迭代版本: BETA 1.0
  7     功能总数: 18 个
  8     新增总数: 3 个
  9     删除总数: 2 个
 10     追加功能:
 11         1. 跨浏览器检测元素从属关系(直接从属+间接从属)
 12         2. 跨浏览器获取与设置滚动条(x轴+y轴)
 13         ...
 14     优化功能:
 15         1. 跨浏览器现代事件绑定(注册事件+注销事件)
 16         2. 跨浏览器配备事件对象(IE 6/7/8 专属)
 17         ...
 18     删除功能:
 19         1. 跨浏览器取消事件冒泡
 20         2. 跨浏览器取消事件默认行为
 21         ...
 22 */
 23 // 工具库
 24 var Tool = {
 25
 26         // 数组排序
 27         sort : function () {
 28             return {
 29                 minToMax : function (min, max) { // 正序: 从小到大
 30                     if (min < max) {
 31                         return -1;
 32                     } else if (min > max) {
 33                         return 1;
 34                     } else {
 35                         return 0;
 36                     }
 37                 },
 38                 maxToMin : function (min, max) { // 倒序: 从大到小
 39                     if (min < max) {
 40                         return 1;
 41                     } else if (min > max) {
 42                         return -1;
 43                     } else {
 44                         return 0;
 45                     }
 46                 }
 47             }
 48         },
 49
 50         // 跨浏览器获取计算后的 CSS 样式
 51         getStyle : function (elementNode, cssKey) {
 52             if (typeof window.getComputedStyle != 'undefined') { // W3C
 53                 return window.getComputedStyle(elementNode, null)[cssKey];
 54             } else if (typeof elementNode.currentStyle != 'undefined') { // IE 6/7/8
 55                 return elementNode.currentStyle[cssKey];
 56             }
 57         },
 58
 59         // 跨浏览器添加样式规则
 60         addRule : function (sheet, ruleName, ruleText, rulePosition) {
 61             if (typeof sheet.insertRule != 'undefined') { // W3C
 62                 sheet.insertRule(ruleName + ' {' + ruleText + '}', rulePosition);
 63             } else if (typeof sheet.addRule != 'undefined') { // IE 6/7/8
 64                 sheet.addRule(ruleName, ruleText, rulePosition);
 65             }
 66         },
 67
 68         // 跨浏览器移除样式规则
 69         removeRule : function (sheet, rulePosition) {
 70             if (typeof sheet.deleteRule != 'undefined') { // W3C
 71                 sheet.deleteRule(rulePosition);
 72             } else if (typeof sheet.removeRule != 'undefined') { // IE 6/7/8
 73                 sheet.removeRule(rulePosition);
 74             }
 75         },
 76
 77         // 跨浏览器获取样式规则总数
 78         getRules : function (sheet) {
 79             if (typeof sheet.cssRules != 'undefined') { // W3C
 80                 return sheet.cssRules.length;
 81             } else if (typeof sheet.rules != 'undefined') { // IE 6/7/8
 82                 return sheet.rules.length;
 83             }
 84         },
 85
 86         // 事件绑定计数器
 87         eventId : 0,
 88
 89         // 跨浏览器现代事件绑定: 注册事件
 90         loginEvent : function (elementNode, eventName, method) {
 91             if (eventName.indexOf('on') == 0) eventName = eventName.substring(2, eventName.length);
 92             if (typeof elementNode.addEventListener != 'undefined') { // W3C
 93                 elementNode.addEventListener(eventName, method, false);
 94             } else if (typeof elementNode.attachEvent != 'undefined') { // IE 6/7/8
 95                 // 创建哈希表，存储事件数组
 96                 if (typeof elementNode.hashTable != 'object') elementNode.hashTable = {};
 97                 // 创建事件数组，储存事件方法
 98                 if (typeof elementNode.hashTable[eventName] != 'object') elementNode.hashTable[eventName] = [];
 99                 // 获取事件数组
100                 var events = elementNode.hashTable[eventName];
101                 // 检测同一节点、同一事件是否方法重复
102                 for (var i = 0; i < events.length; i ++) {
103                     if (events[i] == method) return false;
104                 }
105                 // 储存事件方法
106                 events[this.eventId ++] = method;
107                 var _this = this;
108                 // 执行事件方法
109                 elementNode['on' + eventName] = function () {
110                     var event = _this.eventIE(window.event);
111                     for (var i = 0; i < events.length; i ++) {
112                         if (typeof events[i] != 'undefined') events[i].call(this, event);
113                     }
114                 };
115
116             }
117         },
118
119         // 跨浏览器现代事件绑定: 注销事件
120         logoutEvent : function (elementNode, eventName, method) {
121             if (eventName.indexOf('on') == 0) eventName = eventName.substring(2, eventName.length);
122             if (typeof elementNode.removeEventListener != 'undefined') { // W3C
123                 elementNode.removeEventListener(eventName, method, false);
124             } else if (typeof elementNode.detachEvent != 'undefined') { // IE 6/7/8
125                 if (typeof elementNode.hashTable != 'undefined' && typeof elementNode.hashTable[eventName] != 'undefined') {
126                     var events = elementNode.hashTable[eventName];
127                     for (var i = 0; i < events.length; i ++) {
128                         if (events[i] == method) delete events[i];
129                     }
130                 }
131             }
132         },
133
134         // 跨浏览器配备事件对象(IE 6/7/8 专属)
135         eventIE : function (event) {
136             // 配备取消事件冒泡
137             event.stopPropagation = function () {
138                 event.cancelBubble = true;
139             };
140
141             // 配备取消事件默认行为
142             event.preventDefault = function () {
143                 event.returnValue = false;
144             };
145
146             // 配备获取事件绑定对象
147             event.target = event.srcElement;
148
149             return event;
150         },
151
152         // 跨浏览器鼠标滚轮(中键)事件
153         mousewheel : function (elementNode, method, mode) {
154             if (typeof elementNode.onmousewheel != 'undefined') { // 非 Firefox
155                 mode ? this.loginEvent(elementNode, 'mousewheel', method) : this.logoutEvent(elementNode, 'mousewheel', method);
156             } else { // Firefox
157                 mode ? this.loginEvent(elementNode, 'DOMMouseScroll', method) : this.logoutEvent(elementNode, 'DOMMouseScroll', method);
158             }
159         },
160
161         // 跨浏览器检测元素从属关系(直接从属+间接从属)
162         hasChildNode : function (parentElement, elementNode) {
163             if (typeof parentElement.contains != 'undefined') { // W3C
164                 return parentElement.contains(elementNode);
165             } else if (typeof parentElement.compareDocumentPosition != 'undefined') { // 低版本浏览器
166                 return parentElement.compareDocumentPosition(elementNode) == 20;
167             }
168             return false;
169         },
170
171         // 跨浏览器获取网页可视区宽度尺寸
172         getInnerWidth : function () {
173             if (typeof window.innerWidth != 'undefined') { // W3C
174                 return window.innerWidth;
175             } else { // IE 6/7/8
176                 return document.documentElement.clientWidth;
177             }
178         },
179
180         // 跨浏览器获取网页可视区高度尺寸
181         getInnerHeight : function () {
182             if (typeof window.innerHeight != 'undefined') { // W3C
183                 return window.innerHeight;
184             } else { // IE 6/7/8
185                 return document.documentElement.clientHeight;
186             }
187         },
188
189         // 跨浏览器重置横向窗体滚动条
190         scrollInitializationX : function () {
191             this.scrollX(0);
192         },
193
194         // 跨浏览器重置纵向窗体滚动条
195         scrollInitializationY : function () {
196             this.scrollY(0);
197         },
198
199         // 跨浏览器获取与设置滚动条X轴
200         scrollX : function (x) {
201             if (typeof x != 'undefined') { // 设置
202                 document.documentElement.scrollLeft = x; // 非 Chrome / Safari
203                 document.body.scrollLeft = x; // Chrome / Safari
204             } else { // 获取
205                 return document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
206             }
207         },
208
209         // 跨浏览器获取与设置滚动条Y轴
210         scrollY : function (y) {
211             if (typeof y != 'undefined') { // 设置
212                 document.documentElement.scrollTop = y;
213                 document.body.scrollTop = y;
214             } else { // 获取
215                 return document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
216             }
217         },
218
219         // IE 专属事件: 浏览器外捕获鼠标按下
220         setCaptureIE : function (elementNode) {
221             if (typeof elementNode.setCapture != 'undefined') { // IE
222                 elementNode.setCapture();
223             }
224         },
225
226         // IE 专属事件: 浏览器外捕获鼠标弹起
227         releaseCaptureIE : function (elementNode) {
228             if (typeof elementNode.releaseCapture != 'undefined') { // IE
229                 elementNode.releaseCapture();
230             }
231         }
232 };