十一.jQuery源码解析之.pushStack()

pushStack()顾明思意,就是像桟中添加东西呗,现在看看他是如何添加东西的.
创建一个空的jQuery对象,然后把Dom元素集合放入这个jQuery对象中,
并保留对当前jQuery对象的引用.
pushStack是核心方法之一,它为以下方法提供支持:
jQuery对象遍历:.eq(),first(),.last(),.slice(),.map();
Dom查找,过滤:.find(),.not(),.filter(),.closest(),.add(),.andSelf().
Dom遍历:.parent(),.parents(),parentUntil(),.next(),.prev(),.nextAll(),.prevAll(),
.nextUntil(),.prevUntil(),siblings(),.children(),.contents().
Dom插入:$.before(),$.after(),$.replaceWith(),.append(),.prepent(),.brfore(),.after(),.replaceWith().

241行:定义方法pushStack(elems,name,selector).
elems:准备放入新的jQuery对象的元素数组(或类似数组的集合).
name:产生元素数组elems的jQuery方法名,如eq,find,after,filter...
selector:传给jQuery方法的参数,用于修正原型属性.selector.

243行:thisconstructor是执行jQuery构造函数.加上括号.表示执行资格构造函数.
那么ret就是一个jQuery对象.但是这个jQuery对象里面是没有Dom元素引用的,
只有jQuery本身所具有的成员.
245~250行:是把参数elems合并到新的jQuery对象中.
如果elems是数组,借用push插入;否则调用方法jQuery.merge()合并.
253行:给新的jQuery对象添加属性prevObject(),并指向当前jQuery对象,
形成了一个链式桟.因此,pushStack()还可以理解为,构建一个新的jQuery对象并入栈,
新对象位于栈顶.
255行:给这个新的jQuery指定上下文.this.context要么是指定的上级dom节点,要么是默认的rootjQuery,在前面章节中说过了,不在提了.
257~261行主要是给ret指定选择器的.也就是在传入的参数selector的基础上再改造,
改造完成后作为新对象ret的selector.
264行:返回新的jQuery对象.

311行:prevObject是在调用pushStack中添加的引用,也就是说没有经过入栈的操作,这个引用时为空的;
这个时候会通过constructor这个属性构建一个空的jQuery对象并返回.
.end()方法和.pushStack()方法的原理截然相反.

.pushStack()是用于入栈,而end()确用于出桟.

 $(".guo").find(".yan").css("color","red")  //使用find()入栈(find调用了pushStack())

         .end()          //将find(".yan")出桟

         .find(".si");   //继续寻找$(".guo")..find(".si")

巴特西

十一.jQuery源码解析之.pushStack()

最新文章

热门文章