java自己调用自己的模式_[Java教程]自己封装jquery的一些方法 链式调用模式_星空网...

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

2018-09-20

0

function getIndex(ele){

var parent=ele.parentNode;

var brothers=parent.children;

for(var i=0,len=brothers.length;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

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

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

},

find:function(arg){

var res=[];

for(var i=0,len=this.elements.length;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

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

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

}

return this;

},

show:function(){

for(var i=0,len=this.elements.length;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

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

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

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

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

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);

}

0

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:admin@shaoqun.com。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值