JQuery教程:简化JQuery
http://www.itjxue.com 2015-08-06 23:08 来源:未知 点击次数:
这是以前整理的一些代码，与JQer分享，希望对大家能有些帮助。
话说功能愈发强大的JQuery体积也不再小巧，55k(Minified)的大小虽然不能说很大，但如果用在一些小型项目或网站上，也不算小，那么我们何不根据自己项目特点，简化或改写JQuery呢，Follow me!
首先是JQuery的核心代码：
代码:
//不完全一致，但实现手段大致如此
(function(){
window._$ = window.$;
var $ = window.$ = function(s) {
return new $.fn.init(s);
};
$.fn = $.prototype = {
init: function(s) {
if(!s) return this;
if (s.nodeType) {
this.e = [];
this.e.push(s); //存储获取到的Elements
return this;
}
if (typeof s == “string”) {
return $().find(s);
}
return this;
},
find: function(s) {
//根据传入的String，查找DOM
}
};
// extend扩展方法
$.fn.extend = function(p) {
for(var key in p) {
if(!$.fn[key]) {
$.fn[key] = p[key];
}
}
};
$.fn.init.prototype = $.fn;
})();
$().extend({
“a”: function(s){},
“b”: function(s){}
});
再附上我简化的版本
代码:
// by CNwander
(function(){
window._$ = window.$;
var eleExpr = /([#\.a-zA-Z])([^\s]+)/g;
var $ = window.$ = function(s) {
return new $.fn.init(s);
};
$.fn = $.prototype = {
init: function(s) {
this.e = null;
if(!s) return this;
if (s.nodeType) {
this.e = [];
this.e.push(s);
return this;
}
if (typeof s == “string”) {
return $().find(s);
}
else
return this;
},
find: function(s) {
var wrap = this.e || [document];
var result = [];
for(var key in wrap) {
var target = wrap[key];
while(eleExpr.test(s)) {
var first = RegExp.$1,
content = RegExp.$2;
target = $().clean(target,content,first);
}
if(target == null)
result = null;
else
for(var i = 0; i < target.length; i++)
result.push(target[i]);
}
this.e = result;
return this;
},
clean: function(wrap,content,type){
if(!wrap) return null;
wrap = wrap instanceof Array ? wrap : [wrap];
var result = new Array();
for(var key in wrap) {
var temp;
switch(type) {
case “#”:
temp = wrap[key].getElementById(content);
break;
case “.”:
temp = $().getElemsByClassName(content,wrap[key]);
break;
default:
temp = wrap[key].getElementsByTagName(type+content);
}
if(temp) {
temp = temp.length ? temp : [temp];
for (var i = 0; i < temp.length; i++)
if(temp[i].nodeType) result.push(temp[i]);
}
}
result = result.length <= 0 ? null : result;
return result;
},
getElemsByClassName: function(classname,elem,tag) {
tag = tag || “*”;
elem = elem || document;
elem = elem instanceof Array ? elem : [elem];
var result = new Array();
for(var key in elem) {
var allElems = elem[key].getElementsByTagName(tag) || elem[key].all;
var oElem;
for(var i=0; i<allElems.length; i++){
oElem = allElems[i];
var list = oElem.className.split(” “);
for(var j=0; j<list.length; j++){
if(list[j] == classname) result.push(oElem);
}
}
}
return result.length <= 0 ? null : result;
}
};
$.fn.extend = function(p) {
for(var key in p) {
if(!$.fn[key]) {
$.fn[key] = p[key];
}
}
};
$.fn.init.prototype = $.fn;
})();
$.ajax = function(url,postStr,lastfunc,errfunc) {
var ajax = false;
if(window.XMLHttpRequest) {
ajax = new XMLHttpRequest();
if (ajax.overrideMimeType) {
ajax.overrideMimeType(”text/xml”);
}
}
else if (window.ActiveXObject) {
try {
ajax = new ActiveXObject(”Msxml2.XMLHTTP”);
}
catch (e) {
try {
ajax = new ActiveXObject(”Microsoft.XMLHTTP”);
}
catch (e) {
}
}
}
if (!ajax) {
if(errfunc) errfunc();
return false;
}
ajax.open(”POST”, url, true);
ajax.setRequestHeader(”Content-Type”,”application/x-www-form-urlencoded”);
ajax.send(postStr);
ajax.onreadystatechange = function() {
if (ajax.readyState == 4 && ajax.status == 200) {
if(lastfunc) lastfunc(ajax.responseText);
}
}
}
$().extend({
”html”: function(val){
return val == undefined ?
(this.e[0] ?
this.e[0].innerHTML :
null) :
this.e[0].innerHTML = val;
},
”empty”: function() {
for(var i in this.e) {
var o = this.e[i];
o.innerHTML = ”;
}
return this;
},
”css”: function() {
if(!this.e || arguments.length <= 0) return this;
if(arguments.length == 1 && typeof arguments[0] == “string”) {
arguments[0] = arguments[0].toLowerCase();
return this.e[0].currentStyle ?
this.e[0].currentStyle[arguments[0]] :
window.getComputedStyle (this.e[0], “”).getPropertyValue(arguments[0].replace(/([A-Z])/g, “-$1″));
}
else if(arguments.length >= 2) {
for (var i in this.e)
this.e[i].style[arguments[0]] = arguments[1];
}
},
”hasClass”: function(name) {
if(!this.e) return this;
var allClass = this.e[0].className.split(” “);
for (var key in allClass)
if(allClass[key] == name) return true;
return false;
},
”addClass”: function(name){
if(this.e)
for (var i in this.e)
if(this.e[i].nodeType == 1)
this.e[i].className += ” “+name;
return this;
},
”removeClass”: function(name){
if(this.e)
for (var i in this.e) {
var temp = [],
allClass = this.e[i].className.split(” “);
for(var j = 0, k = 0; j < allClass.length; j++) {
if(allClass[j] != name) {
temp[k++] = allClass[j]
}
}
allClass = temp.join(” “);
this.e[i].className = allClass;
}
return this;
},
”mousedown”: function(callback){
if(!this.e) return this;
for(var key in this.e) {
this.e[key].onmousedown = callback;
return this;
}
},
”mouseover”: function(callback){if(!this.e) return this;for(var key in this.e) {this.e[key].onmouseover = callback} return this},
”mouseout”: function(callback){if(!this.e) return this;for(var key in this.e) {this.e[key].onmouseout = callback}return this}
});
才疏学浅，错误之处，敬请指正。