在jQuerypushstack实现原理及应用实例
顾名思义,pushstack是一堆。作为一种数据结构,堆栈是一种特殊的线性表,它只能在一端插入和删除操作,当数据放入堆栈时,它类似于我们进入电梯并进入第一,如下所示:
jQuery中的堆栈实际上不是一个真正的堆栈,而是一个添加到jQuery对象的属性,指向当前对象的最后一个对象。它可以返回最后一个元素,如下所示:
一
二
三
$('span)。情商(0),Css('fontsize ','20px)。端()FadeOut(2000);
上面的代码会使第一跨度的字体大小20px 2秒内使所有跨fadaout。
pushstack属于jQuery实例方法,它是通过jQuery对象调用,如所有div的背景是通过设置为蓝色(。pushstack)(document.getelementsbytagname(div))。Css(背景','蓝色')。那么什么是pushstack原理,以及为什么可以传入DOM对象是使用CSS方法操作先看看pushstack jQuery源:
pushstack:功能(单元){
构建一个新的jQuery匹配元素
VaR RET = jquery.merge(this.constructor(),单元);
将旧对象添加到堆栈堆栈(作为引用)
这ret.prevobject =;
ret.context = this.context;
新形成的元素集返回
返回页首;
}
/ / jquery.merge
合并:函数(第一,第二){
var = second.length,
我= first.length,
j=0;
如果(typeof =数){
为(;;j < l;j + +){
第一个{ } + } =第二个{ };
}
{人}
而(第二个{ }!=未定义的){
第一个{ } + } =第二个{ } + };
}
}
first.length =我;
返回第一;
}
对pushstack实现相对简单,对jQuery静态方法合并主要相关。此方法用于合并对象。设计思想是在第一个对象的基础上附加第二个对象的属性(0到n)。理解这一点是非常重要的。回到pushstack功能,首先定义一个局部变量ret存储合并后的对象,然后把prevobject和上下文属性的对象,并返回合并后的惩戒对象。这里有几点要注意:
1、this.constructor是jQuery构造器初始化,所以this.constructor()返回一个jQuery对象。
2,因为对象返回的jQuery合并功能是第二功能连接到第一个,RET是一个jQuery对象,这可以解释为什么与pushstack访问DOM对象的操作也可以通过CSS。
3、对返回的对象指向最后一个对象的prevobject属性,所以你可以通过这个属性找到堆栈的最后一个对象。