欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

自己封装jquery的一些方法 链式调用模式

程序员文章站 2023-10-27 22:37:28
function getIndex(ele){ var parent=ele.parentNode; var brothers=parent.children; for(var i=0,len=brothers.length;i


function getindex(ele){

 

var parent=ele.parentnode;
var brothers=parent.children;

for(var i=0,len=brothers.length;i<len;i++){

if(ele==brothers[i]){

return i;

}

}

}

function falsearrtotrue(arr){

return array.prototype.slice.call(arr);
}


function getelementsbyclassname(obj,name){

var obj = obj || window.document;
var els=obj.getelementsbytagname("*");
var arr=[];

for(var i=0,len=els.length;i<len;i++){

if(els[i].classname==name){

arr.push(els[i]);
}

}

return arr;
}

 

function addevent(obj,type,fn){

if(obj.attachevent){

obj.attachevent("on"+type,function(event){

if(false==fn.call(obj)){

var event=event || window.event;
event.cancelbubble=true;
return false;

}

});
}

else if(obj.addeventlistener){

obj.addeventlistener(type,function(event){

if(false==fn()){

event.preventdefault();
event.cancelbubble=true;

}

},false);

}

}

 

function getstyle(obj,style){

return window.getcomputedstyle ? window.getcomputedstyle(obj,null)[style]:obj.currentstyle[style];

}

 

 

function vjquery(arg){

this.elements=[];

switch(typeof arg){

case "string":

switch(arg.charat(0)){

case "#":
var el=document.getelementbyid(arg.substring(1));
this.elements.push(el);
break;
case ".":
this.elements=getelementsbyclassname(document,arg.substring(1));
break;
default:

this.elements=document.getelementsbytagname(arg);

}
break;

case "function":

addevent(window,"load",arg);
break;


case "object":
this.elements.push(arg);
break;

}

}


vjquery.prototype={


extend:function(key,value){


vjquery.prototype[key]=value;

},


eq:function(n){


return $(this.elements[n]);


},

each:function(fn){


for(var i=0,len=this.elements.length;i<len;i++)

fn(i,this.elements[i]);

},

find:function(arg){

var res=[];
for(var i=0,len=this.elements.length;i<len;i++){

switch(arg.charat(0)){

case "." :


var arr=getelementsbyclassname(this.elements[i],arg.substring(1));
res=res.concat(arr);

var vqueryobj=new vjquery();
vqueryobj.elements=res;
return vqueryobj;
break;

default :

var arr=falsearrtotrue(this.elements[i].getelementsbytagname(arg));
res=res.concat(arr);

var vqueryobj=new vjquery();
vqueryobj.elements=res;
return vqueryobj;

}

}

},

index:function(){

return getindex(this.elements.slice(-1)[0]);

},

click:function(fn){

for(var i=0,len=this.elements.length;i<len;i++){

addevent(this.elements[i],"click",fn);

}

return this;

},

size:function(){

return this.elements.length;
},


bind:function(type,fn){

for(var i=0,len=this.elements.length;i<len;i++){


addevent(this.elements[i],type,fn);


}

return this;

},

 


show:function(){

for(var i=0,len=this.elements.length;i<len;i++){

if(this.elements[i].nodetype==1){

this.elements[i].style.display="block";

}

}

return this;
},


hide:function(){

for(var i=0,len=this.elements.length;i<len;i++){

if(this.elements[i].nodetype==1){

this.elements[i].style.display="none";

}

}

return this;

},

toggle:function(f1,f2){

var _arguments=arguments;
var length=_arguments.length;
var index=0;

console.log(index);

this.click(function(){

_arguments[index]();
index=(++index)%length;

});

return this;

},

hover:function(overfn,outfn){

for(var i=0,len=this.elements.length;i<len;i++){

if(this.elements[i].nodetype==1){

addevent(this.elements[i],"mouseover",overfn);
addevent(this.elements[i],"mouseout",outfn);

}

}

return this;

},

css:function(name,value){ //参数有可能是json

if(typeof name=="string"){

for(var i=0,len=this.elements.length;i<len;i++){

if(this.elements[i].nodetype==1){

if(arguments.length==2){

this.elements[i].style[name]=value;
}

else if(arguments.length==1){

return getstyle(this.elements[0],name);
}

}
}

}

else if(typeof name=="object"){


for(var i=0,len=this.elements.length;i<len;i++){


for(var key in name ){

this.elements[i].style[key]=name[key];

}

}

}

return this;

},

attr:function(arg){


for(var i=0,len=this.elements.length;i<len;i++){

if(this.elements[i].nodetype==1){

if(arguments.length==2){

this.elements[i].setattribute([arguments[0]],arguments[1]);
}

else if(arguments.length==1){

this.elements[i].getattribute([arguments[0]]);
}

}

}

return this;


}

}

 

function $(str){

return new vjquery(str);
}