【JavaScript 封装库】Prototype 原型版发布！

  1 /*
  2     源码作者: 石不易(Louis Shi)
  3     联系方式: http://www.shibuyi.net
  4     ===================================================================================================
  5     程序名称: JavaScript 封装库 Prototype 版
  6     迭代版本: 无
  7     功能总数: 14 个
  8     功能介绍: 
  9         1. 实现代码连缀
 10         2. id / name / tagName / class 节点获取
 11         3. class 选择器添加与移除
 12         4. css 规则添加与移除
 13         5. 设置与获取元素内部文本
 14         6. 设置与获取css
 15         7. 实现 click 事件
 16 */
 17 
 18 // 实例化入口
 19 function $() {
 20     return new Base();
 21 }
 22 
 23 // 封装库构造方法
 24 function Base() {
 25     this.elements = [];
 26 }
 27 
 28 // 获取id元素节点
 29 Base.prototype.getId = function (id) {
 30     this.elements.push(document.getElementById(id));
 31     return this;
 32 };
 33 
 34 // 获取name元素节点
 35 Base.prototype.getName = function (name, position) {
 36     if (typeof position != ‘undefined‘) { // 局部
 37         var nodes = $().getTagName(‘*‘, position).elements;
 38         for (var i = 0; i < nodes.length; i ++) {
 39             if (nodes[i].getAttribute(‘name‘) == name) this.elements.push(nodes[i]);
 40         }
 41     } else { // 全局
 42         var nodes = document.getElementsByName(name);
 43         for (var i = 0; i < nodes.length; i ++) {
 44             this.elements.push(nodes[i]);
 45         }
 46     }
 47     return this;
 48 };
 49 
 50 // 获取tagName元素节点
 51 Base.prototype.getTagName = function (tagName, position) {
 52     if (typeof position != ‘undefined‘) { // 局部
 53         var nodes = $().getId(position).elements[0].getElementsByTagName(tagName);
 54     } else { // 全局
 55         var nodes = document.getElementsByTagName(tagName);
 56     }
 57     for (var i = 0; i < nodes.length; i ++) {
 58         this.elements.push(nodes[i]);
 59     }
 60     return this;
 61 };
 62 
 63 // 获取class元素节点
 64 Base.prototype.getClass = function (className, position) {
 65     if (typeof position != ‘undefined‘) { // 局部
 66         var nodes = $().getTagName(‘*‘, position).elements;
 67     } else { // 全局
 68         var nodes = $().getTagName(‘*‘).elements;
 69     }
 70     for (var i = 0; i < nodes.length; i ++) {
 71         if (nodes[i].className == className) this.elements.push(nodes[i]);
 72     }
 73     return this;
 74 };
 75 
 76 // 获取与设置innerHTML
 77 Base.prototype.html = function (text) {
 78     if (typeof text != ‘undefined‘) { // 设置
 79         for (var i = 0; i < this.elements.length; i ++) {
 80             this.elements[i].innerHTML = text;
 81         }
 82     } else { // 获取
 83         var html = [];
 84         for (var i = 0; i < this.elements.length; i ++) {
 85             html.push(this.elements[i].innerHTML);
 86         }
 87         return html;
 88     }
 89     return this;
 90 };
 91 
 92 // 获取与设置CSS
 93 Base.prototype.css = function (cssKey, cssValue) {
 94     if (typeof cssValue != ‘undefined‘ || cssKey instanceof Array) { // 设置
 95         for (var i = 0; i < this.elements.length; i ++) {
 96             if (cssKey instanceof Array) {
 97                 var _cssKye, _cssValue, _css;
 98                 for (var j = 0; j < cssKey.length; j ++) {
 99                     if (cssKey[j].match(/([a-z]+)\s*=\s*([\w#]+)/i) != null) { // [‘color=red‘, ‘backgroundColor = green‘]
100                         _css = cssKey[j].split(/\s*=\s*/);
101                         _cssKey = _css[0];
102                         _cssValue = _css[1];
103                         this.elements[i].style[_cssKey] = _cssValue;
104                     }
105                 }
106             } else {
107                 this.elements[i].style[cssKey] = cssValue;
108             }
109         }
110     } else { // 获取
111         var css = [];
112         for (var i = 0; i < this.elements.length; i ++) {
113             if (typeof window.getComputedStyle != ‘undefined‘) { // W3C
114                 css.push(window.getComputedStyle(this.elements[i], null)[cssKey]);
115             } else if (typeof this.elements[i].currentStyle != ‘undefined‘) { // IE 6/7/8
116                 css.push(this.elements[i].currentStyle[cssKey]);
117             }
118         }
119         return css;
120     }
121     return this;
122 };
123 
124 // 检测class选择器
125 Base.prototype.hasClass = function (className) {
126     var results = [];
127     for (var i = 0; i < this.elements.length; i ++) {
128         results.push(!!this.elements[i].className.match(new RegExp(‘(\\s|^)‘ + className + ‘(\\s|$)‘)));
129     }
130     return results;
131 };
132 
133 // 添加class选择器
134 Base.prototype.addClass = function (className) {
135     var space = ‘‘;
136     var results = this.hasClass(className);
137     for (var i = 0; i < results.length; i ++) {
138         if (!results[i]) {
139             if (this.elements[i].className != ‘‘) space = ‘ ‘;
140             this.elements[i].className += space + className;
141         }
142     }
143     return this;
144 };
145 
146 // 移除class选择器
147 Base.prototype.removeClass = function (className) {
148     var results = this.hasClass(className);
149     for (var i = 0; i < results.length; i ++) {
150         if (results[i]) this.elements[i].className = this.elements[i].className.replace(new RegExp(‘(\\s|^)‘ + className + ‘(\\s|$)‘), ‘‘);
151     }
152     return this;
153 };
154 
155 // 添加样式规则Rule
156 Base.prototype.addRule = function (ruleName, ruleText, index, position) {
157     if (typeof index == ‘undefined‘) index = 0;
158     if (typeof position == ‘undefined‘) position = 0;
159     var sheet = document.styleSheets[index];
160     if (typeof sheet != ‘undefined‘) {
161         if (typeof sheet.insertRule != ‘undefined‘) { // W3C
162             sheet.insertRule(ruleName + ‘ {‘ + ruleText + ‘}‘, position);
163         } else if (sheet.addRule != ‘undefined‘) { // IE 6/7/8
164             sheet.addRule(ruleName, ruleText, position);
165         }
166     }
167     return this;
168 };
169 
170 // 移除样式规则Rule
171 Base.prototype.removeRule = function (index, position) {
172     if (typeof index == ‘undefined‘) index = 0;
173     if (typeof position == ‘undefined‘) position = 0;
174     var sheet = document.styleSheets[index];
175     if (typeof sheet != ‘undefined‘) {
176         if (typeof sheet.deleteRule != ‘undefined‘) { // W3C
177             sheet.deleteRule(position);
178         } else if (typeof sheet.removeRule != ‘undefined‘) { // IE 6/7/8
179             sheet.removeRule(position);
180         }
181     }
182     return this;
183 };
184 
185 // 鼠标 click 事件
186 Base.prototype.click = function (method) {
187     if (method instanceof Function) {
188         for (var i = 0; i < this.elements.length; i ++) {
189             this.elements[i].onclick = method;
190         }
191     }
192     return this;
193 };