自己封装jquery的一些方法 链式调用模式
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);
}
上一篇: Vue2.5笔记:Vue中的模版
下一篇: 最近玩游戏