這是以前整理的一些代碼,與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}
});