js封装获取标签处理操作 ,ajax,ready()方法

总是听前辈说JQ性能上不及js，总是告诉我们这些新手要学会js，怀着谦卑的态度去听从谦卑的告诫。

个人总结并封装js  web方面的一些方法，每个操作下面都有对应的操作事例。

//前台调用var Dom = function() {return new dom();}// 基础库function dom() {// 创建一个数组，来保存获取的节点和节点数组this.elements = [];}// 获取ID节点dom.prototype.getId = function(id) {// return document.getElementById(id);this.elements.push(document.getElementById(id));return this;};// 获取元素节点数组dom.prototype.getTagName = function(tag) {var tags = document.getElementsByTagName(tag);for (var i = 0; i < tags.length; i++) {this.elements.push(tags[i]);}return this;};// 获取CLASS节点数组dom.prototype.getClass = function(className, idName) {var node = null;if (arguments.length == 2) {node = document.getElementById(idName);} else {node = document;}var all = node.getElementsByTagName('*');for (var i = 0; i < all.length; i++) {if (all[i].className == className) {this.elements.push(all[i]);}}return this;}// 获取某一个节点dom.prototype.getElement = function(num) {var element = this.elements[num];this.elements = [];this.elements[0] = element;return this;};// 设置CSSdom.prototype.css = function(attr, value) {for (var i = 0; i < this.elements.length; i++) {if (arguments.length == 1) {if (typeof window.getComputedStyle != 'undefined') {// W3Creturn window.getComputedStyle(this.elements[i], null)[attr];} else if (typeof this.elements[i].currentStyle != 'undeinfed') {// IEreturn this.elements[i].currentStyle[attr];}}this.elements[i].style[attr] = value;}return this;}// 添加Classdom.prototype.addClass = function(className) {for (var i = 0; i < this.elements.length; i++) {if (!this.elements[i].className.match(new RegExp('(\\s|^)' + className+ '(\\s|$)'))) {this.elements[i].className += ' ' + className;}}return this;}// 移除Classdom.prototype.removeClass = function(className) {for (var i = 0; i < this.elements.length; i++) {if (this.elements[i].className.match(new RegExp('(\\s|^)' + className+ '(\\s|$)'))) {this.elements[i].className = this.elements[i].className.replace(new RegExp('(\\s|^)' + className + '(\\s|$)'), ' ');}}return this;}// 添加link或style的CSS规则dom.prototype.addRule = function(num, selectorText, cssText, position) {var sheet = document.styleSheets[num];if (typeof sheet.insertRule != 'undefined') {// W3Csheet.insertRule(selectorText + '{' + cssText + '}', position);} else if (typeof sheet.addRule != 'undefined') {// IEsheet.addRule(selectorText, cssText, position);}return this;}// 移除link或style的CSS规则dom.prototype.removeRule = function(num, index) {var sheet = document.styleSheets[num];if (typeof sheet.deleteRule != 'undefined') {// W3Csheet.deleteRule(index);} else if (typeof sheet.removeRule != 'undefined') {// IEsheet.removeRule(index);}return this;}// 设置innerHTMLdom.prototype.html = function(str) {for (var i = 0; i < this.elements.length; i++) {if (arguments.length == 0) {return this.elements[i].innerHTML;}this.elements[i].innerHTML = str;}return this;}// 设置textContentdom.prototype.text = function(text) {for (var i = 0; i < elements.length; i++) {// 当只有一个elementif (elements.length == 0) {if (document.textContent) {return this.elements[i].textContent = text;} else {return this.elements[i].innerText = text;}}if (document.textContent) {this.elements[i].textContent = text;} else {this.elements[i].innerText = text;}return this;}}dom.prototype.addEvent=function(vartype,eventFunc){if (document.attachEvent) {if (this.elements.lengh) {for (var i = 0, ii = elements.lengh; i < ii; i++)this.elements[i].attach('on' + vartype, eventFunc);} else {this.elements[0].attachEvent('on' + vartype, eventFunc);}} else {if (this.elements.lengh) {for (var i = 0, ii = elements.lengh; i < ii; i++)this.elements[i].addEventListener(vartype, eventFunc,false);} else {this.elements[0].addEventListener(vartype, eventFunc, false);}}}dom.prototype.removeEvent=function(vartype,eventFunc){if (document.attachEvent) {if (this.elements.lengh) {for (var i = 0, ii = elements.lengh; i < ii; i++)this.elements[i].detachEvent('on' + vartype, this.eventFunc);} else {this.elements[0].detachEvent('on' + vartype, this.eventFunc);}} else {if (this.elements.lengh) {for (var i = 0, ii = elements.lengh; i < ii; i++)this.elements[i].removeEventListener(vartype, this.eventFunc,false);} else {this.elements[0].removeEventListener(vartype, this.eventFunc, false);}}}/** * 以上是跟获取id class等后进行相关操作有关 * 使用方法：先获取对应id或者class等标签，例如获取id绑定事件  Dom().getId().addEvent("click",func);必须先获取id ，class等标签 */function AjaxClass() {var XmlHttp = false;try {XmlHttp = new XMLHttpRequest(); // FireFox专有} catch (e) {try {XmlHttp = new ActiveXObject("MSXML2.XMLHTTP");} catch (e2) {try {XmlHttp = new ActiveXObject("Microsoft.XMLHTTP");} catch (e3) {alert("你的浏览器不支持XMLHTTP对象，请升级到IE6以上版本！");XmlHttp = false;}}}var me = this;this.Method = "POST";this.Url = "";this.Async = true;this.Arg = "";this.CallBack = function() {};// this.Loading = function(){};this.Send = function() {if (this.Url == "") {return false;}if (!XmlHttp) {return IframePost();}XmlHttp.open(this.Method, this.Url, this.Async);if (this.Method == "POST") {XmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");}XmlHttp.onreadystatechange = function() {if (XmlHttp.readyState == 4) {var Result = false;if (XmlHttp.status == 200) {Result = XmlHttp.responseText;}XmlHttp = null;me.CallBack(Result);} else {me.Loading();}}if (this.Method == "POST") {XmlHttp.send(this.Arg);} else {XmlHttp.send(null);}}// Iframe方式提交function IframePost() {var Num = 0;var obj = document.createElement("iframe");obj.attachEvent("onload", function() {me.CallBack(obj.contentWindow.document.body.innerHTML);obj.removeNode()});obj.attachEvent("onreadystatechange", function() {if (Num >= 5) {alert(false);obj.removeNode()}});obj.src = me.Url;obj.style.display = 'none';document.body.appendChild(obj);}}/*----------------------------调用方法------------------------------ var Ajax = new AjaxClass();// 创建AJAX对象 Ajax.Method = "POST"; // 设置请求方式为POST Ajax.Url = "default.asp"// URL为default.asp Ajax.Async = true;// 是否异步 Ajax.Arg = "a=1&b=2";// POST的参数 Ajax.Loading = function(){//等待函数 document.write("loading..."); } Ajax.CallBack = function(str)       // 回调函数 { document.write(str); } Ajax.Send();            // 发送请求 ----------------------------------------------------------- var Ajax = new AjaxClass();// 创建AJAX对象 Ajax.Method = "GET"; // 设置请求方式为POST Ajax.Url = "default.asp?a=1&b=2"// URL为default.asp Ajax.Async = true;// 是否异步 Ajax.Loading = function(){//等待函数 document.write("loading..."); } Ajax.CallBack = function(str)       // 回调函数 { document.write(str); } Ajax.Send();           // 发送请求 --------------------------------------------------------------------*/var doReady = (function() {var funcs = [];// 当获得事件要运行的函数var ready = false;// 触发事件处理程序时，切换为truefunction handler(e) {// 注销时间 避免反复触发事件if (ready)return;// 如果发生onreadystatechange事件，但其状态不是complete的话,那么文档尚未准备好if (e.type === "readystatechange" && document.readyState !== "complete")return;// 运行所有的注册函数for (var i = 0; i < funcs.length; i++) {funcs[i].call(document);}// 如果事件全部执行完，切换为read状态，并移除所有函数ready = true;funcs = null;}// 为接受到的事件处理注册函数if (document.addEventListener) {// 兼容Iedocument.addEventListener("DOMContentLoaded", handler, false);document.addEventListener("readystatechange", handler, false);window.addEventListener("load", handler, false);} else if (document.attachEvent) {// iedocument.attachEvent("onreadystatechange", handler);window.attachEvent("load", handler);}// 返回whenReady（）函数return function doReady(loadFunction) {if (ready)loadFunction .call(document);elsefuncs.push(loadFunction);}}())/** * 加载方法 doReady(varObj) */

                                                                                                    虚怀若谷，求贤若渴