十一.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()的更多相关文章
- jQuery 源码解析(三) pushStack方法 详解
该函数用于创建一个新的jQuery对象,然后将一个DOM元素集合加入到jQuery栈中,最后返回该jQuery对象,有三个参数,如下: elems Array类型 将要压入 jQuery 栈的数组元素 ...
- jquery源码解析:pushStack,end,ready,eq详解
上一篇主要讲解了jQuery原型中最重要的方法init.接下来再讲一些比较常用的原型方法和属性 core_slice = [].slice, jQuery.fn = jQuery.prototype ...
- JQuery源码解析(一)
写在前面:本<JQuery源码解析>系列是基于一些前辈们的文章进行进一步的分析.细化.修改而写出来的,在这边感谢那些慷慨提供科普文档的技术大拿们. 要查阅JQ的源文件请下载开发版的JQ.j ...
- jQuery 源码解析二:jQuery.fn.extend=jQuery.extend 方法探究
终于动笔开始 jQuery 源码解析第二篇,写文章还真是有难度,要把自已懂的表述清楚,要让别人听懂真的不是一见易事. 在 jQuery 源码解析一:jQuery 类库整体架构设计解析 一文,大致描述了 ...
- jquery源码解析:代码结构分析
本系列是针对jquery2.0.3版本进行的讲解.此版本不支持IE8及以下版本. (function(){ (21, 94) 定义了一些变量和函数, jQuery = function() ...
- jquery 源码解析
静态与实力方法共享设计 遍历方法 $(".a").each() //作为实例方法存在 $.each() //作为静态方法存在 Jquery源码 jQuery.prototype = ...
- jQuery源码解析资源便签
最近开始解读jQuery源码,下面的链接都是搜过来的,当然妙味课堂 有相关的一系列视频,长达100多期,就像一只蜗牛慢慢爬, 至少品读三个框架,以后可以打打怪,自己造造轮子. 完全理解jQuery源代 ...
- 三.jQuery源码解析之jQuery的框架图
这张图片是对jQuery源码截图,一点一点拼出来的. 现在根据这张图片来对jQuery框架做一些说明. 一.16~9404行可以发现,最外层是一个自调用函数.当jQuery初始化时,这个自调用函数包含 ...
- jquery源码解析:addClass,toggleClass,hasClass详解
这一课,我们将继续讲解jQuery对元素属性操作的方法. 首先,我们先看一下这几个方法是如何使用的: $("#div1").addClass("box1 box2&quo ...
随机推荐
- c++之to_string()函数
函数原型:string to_string (int val);string to_string (long val);string to_string (long long val);string ...
- JVM虚拟机调优指南
本章通过阅读JVM垃圾搜集指南文档,整理虚拟机主要配置以及,理解不同的垃圾搜集器. 垃圾搜集算法 引用计数算法 根搜索算法 标记-清除算法 复制算法 标记-整理算法 分代收集算法 搜集算法网上有很多介 ...
- 《Effective C#》读书笔记——条目13:正确地初始化静态成员变量<.NET资源管理>
我们知道在C#语言中创建一个类型的实例前,就应该初始化该类型的所有静态成员变量.C#语言为我们提供了静态初始化器和静态构造函数.其中,静态构造函数是一个特殊的构造函数,将在其他所有方法执行前以及变 ...
- ActiveSupport::TimeZone; 功能:用户自行选择时区。
TimeZone类作为一个包装器,服务一个TZinfo::Timezone 实例. 用途: 134个时区的检索. 使用简化的英文单词来取回和显示时区:如"Beijing" => ...
- Rails 5 Test Prescriptions 第5章 Testing Models
Rails,model层包含业务逻辑和储存逻辑.其中储存逻辑被ActiveRecord处理. 在model中,不是每件事都必须是ActiveRecord对象.model layer可以包含各种服务,对 ...
- Learn Rails5.2- ActiveRecord: sqlite3的用法, Query查询语法。乐观锁和悲观锁案例,查询语法includes(), 多态关联,destory和delete, Scope, Validats, Migrations
rails generate model photo title:string album:references 这会产生一个album_id列,当建立belongs_to关联时,需要用到. refe ...
- hdu 5696 区间的价值
套路题 求出来以每个数为最大值/最小值时的一个区间范围, 然后枚举每个数为最大值的情况更新即可, 但是对于重复数的话需要特判一下, 假如用map记录来特判复杂度就是$O(nlogn)$, 不过题目说了 ...
- Android orm 框架xUtils简介
数据库操作建议用ORM框架,简单高效.这里推荐xUtils,里面包含DBUtils.github地址:https://github.com/wyouflf/xUtils 获得数据库实例建议用单例模式. ...
- html绘制三角形(兼容IE6)
.sanjiao { width:; height:; overflow: hidden; border-width: 10px; border-color: red transparent tran ...
- PCB 中过孔和通孔焊盘的区别
在PCB设计中,过孔VIA和焊盘PAD都可以实现相似的功能.它们都能插入元件管脚,特别是对于直插DIP)封装的的器件来说,几乎是一样的. 但是!在PCB制造中,它们的处理方法是不一样的. 1.VIA的 ...