【JavaScript 封装库】BETA 2.0 测试版发布！

 

/*
	源码作者: 石不易(Louis Shi)
	联系方式: http://www.shibuyi.net
	===================================================================================
	程序名称: JavaScript 封装库 BETA 2.0 版
	迭代版本: BETA 1.0
	功能总数: 50 个
	新增总数: 6 个
	删除总数: 0 个
	追加功能: 
		1. 库方法: 设置与获取滚动条
		2. 库方法: 定位器筛选
		3. 库方法: 检测元素从属关系(直接从属)
		4. 库方法: 获取网页可视区尺寸
		5. 库方法: 禁止页面滚动(修正浏览器BUG)
		...
	优化功能: 
		1. 取消了“隶属方法”, 增加了“库方法”并与“特效”和“事件”组成集合, 封装库结构更加清晰
		2. 元素节点获取更加智能, 支持 class / name / tagName / id 在内的局部搜索
		3. 添加与删除元素节点更加方便容易, 支持 class / name / tagName / id 直接定位
		...
	删除功能: 
		无
*/

// 实例化封装库
function $(_this) {
	return new Base(_this);
}

// 封装库构造方法
function Base(_this) {
	this.elements = [];
	if (typeof _this == 'object' && _this !== null) this.elements.push(_this);
}

// 获取元素节点
Base.prototype.getNodes = function () {
	if (this.elements.length == 0) return '没有任何节点对象';
	if (this.elements.length == 1) return this.elements[0];
	return this.elements;
};

// 获取 id 元素节点
Base.prototype.getId = function (ids) {
	if (ids instanceof Array) { // 集群
		for (var i in ids) {
			this.getId(ids[i]);
		}
	} else { // 单个
		var node = document.getElementById(ids);
		if (node === null) return this;
		for (var i =0; i < this.elements.length; i ++) {
			if (this.elements[i] == node) return this;
		}
		this.elements.push(node);
	}
	return this;
};

// 获取 name 元素节点
Base.prototype.getName = function (name, position) {
	var nodes = [], selector = [];
	if (typeof position != 'undefined') { // 局部
		selector = Base.positioner(position);
		if (selector instanceof Array) { // 集群
			for (var i = 0; i < selector.length; i ++) {
				nodes.push(selector[i].getElementsByTagName('*'));
			}
		} else { // 单个
			if (typeof selector == 'object') nodes = selector.getElementsByTagName('*'); // 防止 IE 无法识别 name 属性
		}
	} else { // 全局
		nodes = document.getElementsByName(name);
	}
	for (var i = 0; i < nodes.length; i ++) {
		if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
			for (var j = 0; j < nodes[i].length; j ++) {
				if (nodes[i][j].getAttribute('name') == name) this.elements.push(nodes[i][j]);
			}
		} else { // 单集群
			if (nodes[i].getAttribute('name') == name) this.elements.push(nodes[i]);
		}
	}
	return this;
};

// 获取 tagName 元素节点
Base.prototype.getTagName = function (tagName, position) {
	var nodes = [], selector = [];
	if (typeof position != 'undefined') { // 局部
		selector = Base.positioner(position);
		if (selector instanceof Array) { // 集群
			for (var i = 0; i < selector.length; i ++) {
				nodes.push(selector[i].getElementsByTagName(tagName));
			}
		} else { // 单个
			if (typeof selector == 'object') nodes = selector.getElementsByTagName(tagName); // 防止 IE 无法识别 name 属性
		}
	} else { // 全局
		nodes = document.getElementsByTagName(tagName);
	}
	for (var i = 0; i < nodes.length; i ++) {
		if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
			for (var j = 0; j < nodes[i].length; j ++) {
				this.elements.push(nodes[i][j]);
			}
		} else { // 单集群
			this.elements.push(nodes[i]);
		}
	}
	return this;
};

// 获取 class 元素节点
Base.prototype.getClass = function (className, position) {
	var nodes = [], selector = [];
	if (typeof position != 'undefined') { // 局部
		selector = Base.positioner(position);
		if (selector instanceof Array) { // 集群
			for (var i = 0; i < selector.length; i ++) {
				nodes.push(selector[i].getElementsByTagName('*'));
			}
		} else { // 单个
			if (typeof selector == 'object') nodes = selector.getElementsByTagName('*'); // 防止 IE 无法识别 name 属性
		}
	} else { // 全局
		nodes = $().getTagName('*').getNodes();
	}
	for (var i = 0; i < nodes.length; i ++) {
		if (typeof nodes[i] == 'undefined') continue; // 兼容 IE 识别空元素
		if (typeof nodes[i].length != 'undefined' && typeof nodes[i].item != 'undefined') { // 多集群
			for (var j = 0; j < nodes[i].length; j ++) {
				if (Base.hasClass(nodes[i][j], className)) this.elements.push(nodes[i][j]);
			}
		} else { // 单集群
			if (Base.hasClass(nodes[i], className)) this.elements.push(nodes[i]);
		}
	}
	return this;
};

// 获取与设置 innerHTML
Base.prototype.html = function (text) {
	if (typeof text != 'undefined') { // 设置
		for (var i = 0; i < this.elements.length; i ++) {
			this.elements[i].innerHTML = text;
		}
	} else { // 获取
		var html = [];
		for (var i = 0; i < this.elements.length; i ++) {
			html.push(this.elements[i].innerHTML);
		}
		if (html.length == 1) return html[0];
		return html;
	}
	return this;
};

// 获取与设置 value (表单)
Base.prototype.value = function (text) {
	if (typeof text != 'undefined') { // 设置
		for (var i = 0; i < this.elements.length; i ++) {
			if (typeof this.elements[i].value != 'undefined') this.elements[i].value = text;
		}
	} else { // 获取
		var value = [];
		for (var i = 0; i < this.elements.length; i ++) {
			if (typeof this.elements[i].value != 'undefined') value.push(this.elements[i].value);
		}
		if (value.length == 1) return value[0];
		return value;
	}
	return this;
};

// 获取与设置 CSS
Base.prototype.css = function (cssKey, cssValue) {
	if (typeof cssValue != 'undefined' || cssKey instanceof Array) { // 设置
		if (cssKey instanceof Array) { // 集群
			var cssPattern = /^([a-z]+)\s*=\s*([\w\(\)\'\"\\\/\-#\.=%\s]+)$/i;
			var _cssKey = '', _cssValue = '';
			for (var i = 0; i < cssKey.length; i ++) {
				if (cssPattern.test(cssKey[i])) {
					_cssKey = cssPattern.exec(cssKey[i])[1];
					_cssValue = cssPattern.exec(cssKey[i])[2];
					for (var j = 0; j < this.elements.length; j ++) {
						this.elements[j].style[_cssKey] = _cssValue;
					}
				}
			}
		} else { // 单个
			for (var i = 0; i < this.elements.length; i ++) {
				this.elements[i].style[cssKey] = cssValue;
			}
		}
	} else { // 获取
		var css = [];
		for (var i = 0; i < this.elements.length; i ++) {
			css.push(Tool.getStyle(this.elements[i], cssKey));
		}
		if (css.length == 1) return css[0];
		return css;
	}
	return this;
};

// 添加 class 选择器
Base.prototype.addClass = function (className) {
	if (className instanceof Array) { // 集群
		for (var i = 0; i < className.length; i ++) {
			this.addClass(className[i]);
		}
	} else { // 单个
		var space = '';
		for (var i = 0; i < this.elements.length; i ++) {
			if (this.elements[i].className != '') space = ' ';
			if (!Base.hasClass(this.elements[i], className)) this.elements[i].className += space + className;
			space = '';
		}
	}
	return this;
};

// 移除 class 选择器
Base.prototype.removeClass = function (className) {
	if (className instanceof Array) { // 集群
		for (var i = 0; i < className.length; i ++) {
			this.removeClass(className[i]);
		}
	} else { // 单个
		var elementNode = {};
		for (var i = 0; i < this.elements.length; i ++) {
			elementNode = this.elements[i];
			if (Base.hasClass(elementNode, className)) {
				elementNode.className = elementNode.className.replace(new RegExp('\\s+' + className + '\\s+', 'i'), ' ');
				elementNode.className = elementNode.className.replace(new RegExp('(\\s+|^)' + className + '($|\\s+)', 'i'), '');
			}
		}
	}
	return this;
};

// 添加样式规则
Base.prototype.addRule = function (ruleName, ruleText, rulePosition, sheetIndex) {
	if (ruleName instanceof Array) { // 集群
		if (!ruleText instanceof Array || ruleName.length != ruleText.length) return this;
		for (var i = 0; i < ruleName.length; i ++) {
			this.addRule(ruleName[i], ruleText[i], rulePosition, sheetIndex);
		}
	} else { // 单个
		var rule = Base.checkRule(rulePosition, sheetIndex);
		if (typeof rule.sheet != 'undefined') {
			Tool.addRule(rule.sheet, ruleName, ruleText, rule.position);
		}
	}
	return this;
};

// 移除样式规则
Base.prototype.removeRule = function (rulePosition, ruleNumber, sheetIndex) {
	var rule = Base.checkRule(rulePosition, sheetIndex, ruleNumber);
	if (typeof rule.sheet != 'undefined') {
		for (var i = 0; i < rule.number; i ++) {
			Tool.removeRule(rule.sheet, rule.position);
		}
	}
	return this;
};

/*
	事件集合
*/
// 鼠标 click 事件
Base.prototype.click = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'click', method) : Tool.logoutEvent(this.elements[i], 'click', method);
		}
	}
	return this;
};

// 鼠标 mouseover 事件
Base.prototype.mouseover = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'mouseover', method) : Tool.logoutEvent(this.elements[i], 'mouseover', method);
		}
	}
	return this;
};

// 鼠标 mouseout 事件
Base.prototype.mouseout = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'mouseout', method) : Tool.logoutEvent(this.elements[i], 'mouseout', method);
		}
	}
	return this;
};

// 鼠标 mousedown 事件
Base.prototype.mousedown = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'mousedown', method) : Tool.logoutEvent(this.elements[i], 'mousedown', method);
		}
	}
	return this;
};

// 鼠标 mousemove 事件
Base.prototype.mousemove = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'mousemove', method) : Tool.logoutEvent(this.elements[i], 'mousemove', method);
		}
	}
	return this;
};

// 鼠标 mouseup 事件
Base.prototype.mouseup = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'mouseup', method) : Tool.logoutEvent(this.elements[i], 'mouseup', method);
		}
	}
	return this;
};

// 鼠标 mousewheel 事件
Base.prototype.mousewheel = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			Tool.mousewheel(this.elements[i], method, mode);
		}
	}
	return this;
};

// 元素 load 事件
Base.prototype.load = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'load', method) : Tool.logoutEvent(this.elements[i], 'load', method);
		}
	}
	return this;
};

// 元素 scroll 事件
Base.prototype.scroll = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'scroll', method) : Tool.logoutEvent(this.elements[i], 'scroll', method);
		}
	}
	return this;
};

// 窗框 resize 事件
Base.prototype.resize = function (method, mode) {
	if (typeof mode == 'undefined') mode = true;
	if (typeof method == 'function') {
		for (var i = 0; i < this.elements.length; i ++) {
			mode ? Tool.loginEvent(this.elements[i], 'resize', method) : Tool.logoutEvent(this.elements[i], 'resize', method);
		}
	}
	return this;
};

/*
	特效集合
*/
// 特效: 元素隐藏
Base.prototype.hide = function () {
	for (var i = 0; i < this.elements.length; i ++) {
		$(this.elements[i]).css('display', 'none');
	}
	return this;
};

// 特效: 元素显示
Base.prototype.show = function () {
	for (var i = 0; i < this.elements.length; i ++) {
		$(this.elements[i]).css('display', 'block');
	}
	return this;
};

// 特效: 鼠标移入移出 (下拉菜单)
Base.prototype.hover = function (overMethod, outMethod) {
	this.mouseover(overMethod);
	this.mouseout(outMethod);
	return this;
};

// 特效: 定位居中
Base.prototype.center = function () {
	var innerRectangle = Base.getInnerRectangle();
	var scroll = Base.scroll();
	var rectangle = {}, outerX = 0, outerY = 0;
	for (var i = 0; i < this.elements.length; i ++) {
		Base.setAbsolutePosition(this.elements[i]);
		rectangle = Base.getRectangle(this.elements[i]);
		outerX = (innerRectangle.innerWidth - rectangle.width) / 2;
		outerY = (innerRectangle.innerHeight - rectangle.height) / 2;
		if (outerX < 0) outerX = 0;
		if (outerY < 0) outerY = 0;
		$(this.elements[i]).css(['left = ' + ( scroll.scrollX + outerX) + 'px', 'top = ' + (scroll.scrollY + outerY) + 'px']);
	}
	return this;
};

// 特效: 遮罩锁屏
Base.prototype.lock = function () {
	var screenLock = $().getId('screenLock').getNodes();
	if (typeof screenLock == 'object') {
		if (Base.trim($(Base.commentNode(screenLock)).html()) != 0) {
			Base.removeElement(screenLock);
			screenLock = Base.addElement('div', 'id = screenLock');
		}
	} else {
		screenLock = Base.addElement('div', 'id = screenLock');
	}
	var scroll = Base.scroll();
	$(document.documentElement).css('overflow', 'hidden');
	Base.scroll(scroll.scrollX, scroll.scrollY);
	var innerRectangle = Base.getInnerRectangle();
	Base.setAbsolutePosition(screenLock);
	$(screenLock).css([
										'zIndex = 9998', 
										'left = ' + scroll.scrollX + 'px',
										'top = ' + scroll.scrollY + 'px',
										'width = ' + innerRectangle.innerWidth + 'px', 
										'height = ' + innerRectangle.innerHeight + 'px', 
										'backgroundColor = black',
										'opacity = 0.4', // W3C
										'filter = alpha(opacity = 40)'// IE 6/7/8
									]).show();
	Base.fixed(screenLock);
	return this;
};

// 特效: 清屏销锁
Base.prototype.unlock = function () {
	var screenLock = $().getId('screenLock').getNodes();
	if (typeof screenLock == 'object') {
		var scroll = Base.scroll();
		$(document.documentElement).css('overflow', 'auto');
		Base.scroll(scroll.scrollX, scroll.scrollY);
		$(screenLock).hide();
	}
	return this;
};

// 特效: 元素拖拽
Base.prototype.drag = function (mode) {
	if (typeof mode == 'undefined') mode = true;
	var down = function (event) {
		_this = mode ? this : this.parentNode;
		Base.setAbsolutePosition(_this);
		if (Base.trim($(Base.commentNode(_this)).html()).length == 0) event.preventDefault();
		var outerRectangle = Base.getOuterRectangle(_this);
		var fixedX = event.clientX - outerRectangle.outerX;
		var fixedY = event.clientY - outerRectangle.outerY;
		var scroll = Base.scroll();
		Tool.setCaptureIE(_this);
		var move = function (event) {
			var innerRectangle = Base.getInnerRectangle();
			var rectangle = Base.getRectangle(_this);
			var outerX = event.clientX - fixedX;
			var outerY = event.clientY - fixedY;
			var minX = scroll.scrollX, minY = scroll.scrollY;
			var maxX = innerRectangle.innerWidth - rectangle.width + scroll.scrollX;
			var maxY = innerRectangle.innerHeight - rectangle.height + scroll.scrollY;
			if (outerX < minX) outerX = minX; else if (outerX > maxX) outerX = maxX;
			if (outerY < minY) outerY = minY; else if (outerY > maxY) outerY = maxY;
			$(_this).css(['left = ' + outerX + 'px', 'top = ' + outerY + 'px']);
		};
		$(document).mousemove(move);
		var up = function () {
			Tool.releaseCaptureIE(_this);
			$(document).mousemove(move, false);
			$(document).mouseup(up, false);
		};
		$(document).mouseup(up);
	};
	this.mousedown(down);
	return this;
};

// 特效: 禁止元素溢出
Base.prototype.overflow = function () {
	var scroll = Base.scroll();
	var rectangle = {}, outerRectangle = {}, minX = 0, minY = 0, maxX = 0, maxY = 0, outerX = 0, outerY = 0;
	var innerRectangle = Base.getInnerRectangle();
	for (var i = 0; i < this.elements.length; i ++) {
		Base.setAbsolutePosition(this.elements[i]);
		rectangle = Base.getRectangle(this.elements[i]);
		outerRectangle = Base.getOuterRectangle(this.elements[i]);
		outerX = outerRectangle.outerX;
		outerY = outerRectangle.outerY;
		minX = scroll.scrollX;
		minY = scroll.scrollY;
		maxX = innerRectangle.innerWidth - rectangle.width + scroll.scrollX;
		maxY = innerRectangle.innerHeight - rectangle.height + scroll.scrollY;
		if (outerX < minX) outerX = minX; else if (outerX > maxX) outerX = maxX;
		if (outerY < minY) outerY = minY; else if (outerY > maxY) outerY = maxY;
		$(this.elements[i]).css(['left = ' + outerX + 'px', 'top = ' + outerY + 'px']);
	}
	return this;
};
/*
	库方法集合
*/
// 库方法: 重置滚动条
Base.scrollInitialization = function () {
	Tool.scrollInitializationX();
	Tool.scrollInitializationY();
};

// 库方法: 设置与获取滚动条
Base.scroll = function (x, y) {
	if (typeof x == 'number' && typeof y == 'number') { // 设置
		Tool.scrollX(x);
		Tool.scrollY(y);
	} else { // 获取
		return {
			scrollX : Tool.scrollX(),
			scrollY : Tool.scrollY()
		}
	}
};

// 库方法: 检测 class 元素节点
Base.hasClass = function (elementNode, className) {
	if ((new RegExp('(^|\\s+)' + className + '(\\s+|$)', 'i')).test(elementNode.className)) return true;
	return false;
};

// 库方法: 检测样式规则
Base.checkRule = function (rulePosition, sheetIndex, ruleNumber) {
	if (typeof sheetIndex == 'undefined' || isNaN(sheetIndex)) sheetIndex = 0;
	var sheetObject = document.styleSheets[sheetIndex];
	var rules = Tool.getRules(sheetObject);
	if (rules == 0) {
		rulePosition = 0;
		ruleNumber = 0;
	}
	if (typeof rulePosition == 'undefined' || isNaN(rulePosition)) rulePosition = 0;
	if (rules < rulePosition) rulePosition = rules;
	if (typeof ruleNumber == 'undefined' || isNaN(ruleNumber)) ruleNumber = 1;
	if (rules < ruleNumber) ruleNumber = rules;
	if (rules - rulePosition < ruleNumber) ruleNumber = rules - rulePosition;
	return {
		position : rulePosition,
		sheet : sheetObject,
		number : ruleNumber
	}
};

// 库方法: 字符串截取
Base.substring = function (string, index) {
	if (typeof string != 'string') return string;
	if (string.indexOf(index) != -1) string = string.replace(index, '');
	return string;
};

// 库方法: 屏蔽两边空格
Base.trim = function (string) {
	if (typeof string != 'string') return string;
	var leftPattern = /^([\s\t]+)/, rightPattern = /([\s\t]+)$/;
	if (leftPattern.test(string)) string = string.replace(leftPattern, '');
	if (rightPattern.test(string)) string = string.replace(rightPattern, '');
	return string;
};

// 库方法: 屏蔽空白文本节点
Base.spaceNode = function (elementNode) {
	if (typeof elementNode != 'object') return elementNode;
	var childs = elementNode.childNodes;
	var pattern = /^[\s\t]+$/;
	for (var i = 0; i < childs.length; i ++) {
		if (childs[i].nodeType == 3 && pattern.test(childs[i].nodeValue)) elementNode.removeChild(childs[i]);
	}
	return elementNode;
}

// 库方法: 屏蔽注释节点
Base.commentNode = function (elementNode) {
	if (typeof elementNode != 'object') return elementNode;
	var childs = elementNode.childNodes;
	var position = '';
	if (elementNode.id != '') {
		position = elementNode.id;
	} else if (elementNode.className != '') {
		position = 'class = ' + elementNode.className;
	} else {
		position = 'tagName = ' + elementNode.tagName;
	}
	var comments = $().getTagName('!', position).getNodes();
	if (comments instanceof Array) { // 兼容 IE 
		for (var i = 0; i < comments.length; i ++) {
			elementNode.removeChild(comments[i]);
		}
	}
	for (var j = 0; j < childs.length; j ++) {
		if (childs[j].nodeType == 8) elementNode.removeChild(childs[j]);
	}
	return elementNode;
};

// 库方法: 定位器筛选
Base.positioner = function (position) {
	var namePattern = /^name\s*=\s*(\w+)$/i;
	var tagNamePattern = /^tag(Name)?\s*=\s*(\w+)$/i;
	var classPattern = /^class(Name)?\s*=\s*(\w+)$/i;
	var idPattern = /^id\s*=\s*(\w+)$/i;
	var selector = [];
	if (namePattern.test(position)) { // name
		position = namePattern.exec(position)[1];
		selector = $().getName(position).getNodes();
	} else if (tagNamePattern.test(position)) { // tagName
		position = tagNamePattern.exec(position)[2];
		selector = $().getTagName(position).getNodes();
	} else if (classPattern.test(position)) { // class
		position = classPattern.exec(position)[2];
		selector = $().getClass(position).getNodes();
	} else if (idPattern.test(position)) { // id
		position = idPattern.exec(position)[1];
		selector = $().getId(position).getNodes();
	} else { // id
		selector = $().getId(position).getNodes();
	}
	return selector;
}

// 库方法: 添加属性
Base.addAttribute = function (elementNode, attributes) {
	if (attributes instanceof Array) {
		for (var i = 0; i < attributes.length; i ++) {
			this.addAttribute(elementNode, attributes[i]);
		}
	} else {
		var attributePattern = /^([a-z]+)\s*=\s*([\w\-\\\/=\s\';\.:\"\)\(]+)$/i;
		var attributeKey = '', attributeValue = '';
		if (attributePattern.test(attributes)) {
			attributeKey = attributePattern.exec(attributes)[1];
			attributeValue = attributePattern.exec(attributes)[2];
			if (attributeKey == 'style') { // CSS IE 6/7 特殊处理
				var cssPattern = /^([a-z]+)\s*:\s*([\w\(\)\'\"\\\/\-#\.=%\s]+)$/i;
				var cssKey = '', cssValue = '';
				if (/(;\s*)/.test(attributeValue)) { // 集群
					attributeValue = attributeValue.replace(/(;\s*)/g, '|');
					var css = attributeValue.split('|');
					for (var i = 0; i < css.length; i ++) {
						if (cssPattern.test(css[i])) {
							cssKey = cssPattern.exec(css[i])[1];
							cssValue = cssPattern.exec(css[i])[2];
							$(elementNode).css(cssKey, cssValue);
						}
					}
				} else { // 单个
					if (cssPattern.test(attributeValue)) {
						cssKey = cssPattern(attributeValue).exec(attributeValue)[1];
						cssValue = cssPattern(attributeValue).exec(attributeValue)[2];
						$(elementNode).css(cssKey, cssValue);
					}
				}
			} else {
				elementNode.setAttribute(attributeKey, attributeValue);
			}
		}
	}
	
};

// 库方法: 创建元素节点
Base.addElement = function (elementName, attributes, html, parentElement) {
	if (typeof parentElement == 'undefined' && typeof parentElement != 'string' && typeof parentElement != 'object') parentElement = document.body;
	if (typeof parentElement == 'string') parentElement = Base.positioner(parentElement);
	var elementNode = document.createElement(elementName);
	if (typeof html != 'undefined') $(elementNode).html(html);
	if (typeof attributes != 'undefined') Base.addAttribute(elementNode, attributes);
	if (parentElement instanceof Array) { // 集群
		for (var i = 0; i < parentElement.length; i ++) {
			parentElement[i].appendChild(elementNode);
		}
	} else { // 单个
		parentElement.appendChild(elementNode);
	}
	return elementNode;
};

// 库方法: 删除元素节点
Base.removeElement = function (attributes, parentElement) {
	if (typeof parentElement == 'string') parentElement = Base.positioner(parentElement);
	if (attributes instanceof Array) { // 集群
		for (var i = 0; i < attributes.length; i ++) {
			this.removeElement(attributes[i], parentElement);
		}
	} else { // 单个
		elementNode = typeof attributes == 'object' ? attributes : Base.positioner(attributes);
		if (elementNode instanceof Array) { // 集群
			var sevedNode = [];
			for (var i = 0; i < elementNode.length; i ++) {
				sevedNode = elementNode;
				this.removeElement(elementNode[i], parentElement);
				elementNode = sevedNode;
			}
		} else { // 单个
			if (typeof parentElement == 'undefined') parentElement = elementNode.parentNode;
			if (parentElement instanceof Array) { // 集群
				for (var i = 0; i < parentElement.length; i ++) {
					if (typeof parentElement[i] == 'object' && Base.hasChildNode(parentElement[i], elementNode)) parentElement[i].removeChild(elementNode);
				}
			} else { // 单个
				if (typeof parentElement == 'object' && Base.hasChildNode(parentElement, elementNode)) parentElement.removeChild(elementNode);
			}
		}
	}
};

// 库方法: 检测元素从属关系(直接从属)
Base.hasChildNode = function (parentElement, elementNode) {
	var childs = parentElement.childNodes;
	for (var i = 0; i < childs.length; i ++) {
		if (childs[i] == elementNode) return true;
	}
	return false;
};

// 库方法: 获取元素大小尺寸
Base.getRectangle = function (elementNode) {
	var width = 0, height = 0, display = '', _this = {};
	_this = $(elementNode);
	width = _this.css('width');
	height = _this.css('height');
	display = _this.css('display');
	if (width == 'auto' || height == 'auto') {
		if (display == 'none') _this.show();
		width = elementNode.offsetWidth;
		height = elementNode.offsetHeight;
	}
	width = this.substring(width, 'px');
	height = this.substring(height, 'px');
	return {
		width : width,
		height : height
	};
};

// 库方法: 获取元素外边距尺寸
Base.getOuterRectangle = function (elementNode) {
	this.setAbsolutePosition(elementNode);
	var outerX = 0, outerY = 0, display = '', _this = {};
	_this = $(elementNode);
	outerX = _this.css('left');
	outerY = _this.css('top');
	display = _this.css('display');
	if (outerX == 'auto' || outerY == 'auto') {
		if (display == 'none') _this.show();
		outerX = elementNode.offsetLeft;
		outerY = elementNode.offsetTop;
	}
	outerX = this.substring(outerX, 'px');
	outerY = this.substring(outerY, 'px');
	return {
		outerX : outerX,
		outerY : outerY
	};
};

// 库方法: 获取网页可视区尺寸
Base.getInnerRectangle = function () {
	var innerWidth = Tool.getInnerWidth();
	var innerHeight = Tool.getInnerHeight();
	return {
		innerWidth : innerWidth,
		innerHeight : innerHeight
	};
};

// 库方法: 设置元素绝对定位
Base.setAbsolutePosition = function (elementNode) {
	if ($(elementNode).css('position') != 'absolute') {
		$(elementNode).css(['position = absolute', 'left = 0', 'top = 0']);
	}
};

// 库方法: 禁止页面滚动(修正浏览器BUG)
Base.fixed = function (elementNode) {
	// IE 禁止方式
	$(elementNode).mousedown(function () {
		$(elementNode).mousemove(function (event) {
			event.preventDefault();
		});
	});
	// Chrome 禁止方式
	$(elementNode).mousewheel(function (event) {
		event.preventDefault();
	});
};

 

/*
	源码作者: 石不易(Louis Shi)
	联系方式: http://www.shibuyi.net
	===================================================================================
	程序名称: JavaScript 工具库(跨浏览器兼容) BETA 2.0 版
	迭代版本: BETA 1.0
	功能总数: 18 个
	新增总数: 3 个
	删除总数: 2 个
	追加功能: 
		1. 跨浏览器检测元素从属关系(直接从属+间接从属)
		2. 跨浏览器获取与设置滚动条(x轴+y轴)
		...
	优化功能: 
		1. 跨浏览器现代事件绑定(注册事件+注销事件)
		2. 跨浏览器配备事件对象(IE 6/7/8 专属)
		...
	删除功能: 
		1. 跨浏览器取消事件冒泡
		2. 跨浏览器取消事件默认行为
		...
*/
// 工具库
var Tool = {

		// 数组排序
		sort : function () {
			return {
				minToMax : function (min, max) { // 正序: 从小到大
					if (min < max) {
						return -1;
					} else if (min > max) {
						return 1;
					} else {
						return 0;
					}
				},
				maxToMin : function (min, max) { // 倒序: 从大到小
					if (min < max) {
						return 1;
					} else if (min > max) {
						return -1;
					} else {
						return 0;
					}
				}
			}
		},
		
		// 跨浏览器获取计算后的 CSS 样式
		getStyle : function (elementNode, cssKey) {
			if (typeof window.getComputedStyle != 'undefined') { // W3C
				return window.getComputedStyle(elementNode, null)[cssKey];
			} else if (typeof elementNode.currentStyle != 'undefined') { // IE 6/7/8
				return elementNode.currentStyle[cssKey];
			}
		},
		
		// 跨浏览器添加样式规则
		addRule : function (sheet, ruleName, ruleText, rulePosition) {
			if (typeof sheet.insertRule != 'undefined') { // W3C
				sheet.insertRule(ruleName + ' {' + ruleText + '}', rulePosition);
			} else if (typeof sheet.addRule != 'undefined') { // IE 6/7/8
				sheet.addRule(ruleName, ruleText, rulePosition);
			}
		},
		
		// 跨浏览器移除样式规则
		removeRule : function (sheet, rulePosition) {
			if (typeof sheet.deleteRule != 'undefined') { // W3C
				sheet.deleteRule(rulePosition);
			} else if (typeof sheet.removeRule != 'undefined') { // IE 6/7/8
				sheet.removeRule(rulePosition);
			}
		},
		
		// 跨浏览器获取样式规则总数
		getRules : function (sheet) {
			if (typeof sheet.cssRules != 'undefined') { // W3C
				return sheet.cssRules.length;
			} else if (typeof sheet.rules != 'undefined') { // IE 6/7/8
				return sheet.rules.length;
			}
		},
		
		// 事件绑定计数器
		eventId : 0,
		
		// 跨浏览器现代事件绑定: 注册事件
		loginEvent : function (elementNode, eventName, method) {
			if (eventName.indexOf('on') == 0) eventName = eventName.substring(2, eventName.length);
			if (typeof elementNode.addEventListener != 'undefined') { // W3C
				elementNode.addEventListener(eventName, method, false);
			} else if (typeof elementNode.attachEvent != 'undefined') { // IE 6/7/8
				// 创建哈希表，存储事件数组
				if (typeof elementNode.hashTable != 'object') elementNode.hashTable = {};
				// 创建事件数组，储存事件方法
				if (typeof elementNode.hashTable[eventName] != 'object') elementNode.hashTable[eventName] = [];
				// 获取事件数组
				var events = elementNode.hashTable[eventName];
				// 检测同一节点、同一事件是否方法重复
				for (var i = 0; i < events.length; i ++) {
					if (events[i] == method) return false;
				}
				// 储存事件方法
				events[this.eventId ++] = method;
				var _this = this;
				// 执行事件方法
				elementNode['on' + eventName] = function () {
					var event = _this.eventIE(window.event);
					for (var i = 0; i < events.length; i ++) {
						if (typeof events[i] != 'undefined') events[i].call(this, event);
					}
				};
				
			}
		},
		
		// 跨浏览器现代事件绑定: 注销事件
		logoutEvent : function (elementNode, eventName, method) {
			if (eventName.indexOf('on') == 0) eventName = eventName.substring(2, eventName.length);
			if (typeof elementNode.removeEventListener != 'undefined') { // W3C
				elementNode.removeEventListener(eventName, method, false);
			} else if (typeof elementNode.detachEvent != 'undefined') { // IE 6/7/8
				if (typeof elementNode.hashTable != 'undefined' && typeof elementNode.hashTable[eventName] != 'undefined') {
					var events = elementNode.hashTable[eventName];
					for (var i = 0; i < events.length; i ++) {
						if (events[i] == method) delete events[i];
					}
				}
			}
		},
		
		// 跨浏览器配备事件对象(IE 6/7/8 专属)
		eventIE : function (event) {
			// 配备取消事件冒泡
			event.stopPropagation = function () {
				event.cancelBubble = true;
			};
			
			// 配备取消事件默认行为
			event.preventDefault = function () {
				event.returnValue = false;
			};
			
			// 配备获取事件绑定对象
			event.target = event.srcElement;
			
			return event;
		},
		
		// 跨浏览器鼠标滚轮(中键)事件
		mousewheel : function (elementNode, method, mode) {
			if (typeof elementNode.onmousewheel != 'undefined') { // 非 Firefox
				mode ? this.loginEvent(elementNode, 'mousewheel', method) : this.logoutEvent(elementNode, 'mousewheel', method);
			} else { // Firefox
				mode ? this.loginEvent(elementNode, 'DOMMouseScroll', method) : this.logoutEvent(elementNode, 'DOMMouseScroll', method);
			}
		},
		
		// 跨浏览器检测元素从属关系(直接从属+间接从属)
		hasChildNode : function (parentElement, elementNode) {
			if (typeof parentElement.contains != 'undefined') { // W3C
				return parentElement.contains(elementNode);
			} else if (typeof parentElement.compareDocumentPosition != 'undefined') { // 低版本浏览器
				return parentElement.compareDocumentPosition(elementNode) == 20;
			}
			return false;
		},
		
		// 跨浏览器获取网页可视区宽度尺寸
		getInnerWidth : function () {
			if (typeof window.innerWidth != 'undefined') { // W3C
				return window.innerWidth;
			} else { // IE 6/7/8
				return document.documentElement.clientWidth;
			}
		},
		
		// 跨浏览器获取网页可视区高度尺寸
		getInnerHeight : function () {
			if (typeof window.innerHeight != 'undefined') { // W3C
				return window.innerHeight;
			} else { // IE 6/7/8
				return document.documentElement.clientHeight;
			}
		},
		
		// 跨浏览器重置横向窗体滚动条
		scrollInitializationX : function () {
			this.scrollX(0);
		},
		
		// 跨浏览器重置纵向窗体滚动条
		scrollInitializationY : function () {
			this.scrollY(0); 
		},
		
		// 跨浏览器获取与设置滚动条X轴
		scrollX : function (x) {
			if (typeof x != 'undefined') { // 设置
				document.documentElement.scrollLeft = x; // 非 Chrome / Safari
				document.body.scrollLeft = x; // Chrome / Safari
			} else { // 获取
				return document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
			}
		},
		
		// 跨浏览器获取与设置滚动条Y轴
		scrollY : function (y) {
			if (typeof y != 'undefined') { // 设置
				document.documentElement.scrollTop = y; 
				document.body.scrollTop = y;
			} else { // 获取
				return document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
			}
		},
		
		// IE 专属事件: 浏览器外捕获鼠标按下
		setCaptureIE : function (elementNode) {
			if (typeof elementNode.setCapture != 'undefined') { // IE
				elementNode.setCapture();
			}
		},
		
		// IE 专属事件: 浏览器外捕获鼠标弹起
		releaseCaptureIE : function (elementNode) {
			if (typeof elementNode.releaseCapture != 'undefined') { // IE
				elementNode.releaseCapture();
			}
		}
};

 

关于 BETA 2.0 测试版核心源码与实例演示的获取请移动至官网下载！

 

感谢大家积极评测给予意见！

 

官网地址：http://www.shibuyi.net

 

CNBlogs 博客：http://www.cnblogs.com/shibuyi/

 

CSDN 博客：http://blog.csdn.net/louis_shi/

 

ITeye 博客：http://shibuyi.iteye.com/