jQuery中的end()
要说end(),我们就不得不说prevObject。
在jQuery中,每个jQuery对象都有一个prevObject属性
var $p = $('p');
这个属性是做什么的呢?
jQuery内部维护着一个jQuery对象栈。每个遍历方法都会找到一组新元素(一个jQuery对象),然后jQuery会把这组元素推入到栈中。
可能上面这句话让人读起来有些茫然,不要紧,我们来一个例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div{
width:100px;
height:100px;
background-color: antiquewhite;
margin-bottom: 10px;
}
</style>
</head>
<body> <div></div>
<div></div>
<script src="jquery-3.1.1.js"></script>
<script>
console.log($('div').eq(0)); // 第二个div元素
console.log($('div').eq(0).end()); // $('div) </script>
</body>
</html>
看完上面这个例子,我们就大概就能明白end()的作用了。$('div').eq(0)的pervObject为$('div')。而end()的作用就是返回当前jQuery对象(在本例中就是$('div').eq(0))的prevObject对象。
来张图:
来看一看end()的源码:
jQuery.fn.end = function() {
return this.prevObject || this.constructor(null); // 返回当前jQuery对象的prevObject对象,简单直接
};
为了更深入了了解prevObject的实现原理,我们先来看一看eq()的源码:
jQuery.eq = function( i ) {
var len = this.length,
j = +i + ( i < 0 ? len : 0 ); // 负索引对应的正索引 = 负索引 + 长度
return this.pushStack( j >= 0 && j < len ? [ this[j] ] : [] ); // 讲对应的DOM元素入栈操作
}
eq()用了一个pushStack()方法,那么pushStack()是什么鬼? pushStack会将传入的DOM元素创建为一个新的jQuery对象,并将这个新的jQuery对象的prevObject属性进行修改。
jQuery.fn.pushStack = function( elems ) { // Build a new jQuery matched element set
var ret = jQuery.merge( this.constructor(), elems ); // Add the old object onto the stack (as a reference)
ret.prevObject = this;
ret.context = this.context; // Return the newly-formed element set
return ret;
}; // 将DOM元素融入到jQuery对象中,并返回融合后的jQuery对象
jQuery.merge = function( first, second ) {
// first:jQuery对象 second:DOM元素组成的数组
var len = +second.length,
j = 0,
i = first.length; for ( ; j < len; j++ ) {
first[ i++ ] = second[ j ];
} first.length = i; return first;
};
jQuery中的end()的更多相关文章
- [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...
- JQuery中的工具函数总结
前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" typ ...
- JQuery中ajax的相关方法总结
前提条件 话说是jquery中的ajax方法,那么前提条件当然是引入jquery啦. <script src="http://libs.baidu.com/jquery/1.9.0/j ...
- JavaScript jQuery 中定义数组与操作及jquery数组操作
首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...
- jQuery中的100个技巧
1.当document文档就绪时执行JavaScript代码. 我们为什么使用jQuery库呢?原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行. < ...
- jquery中ajax用return来返回值无效
jquery中,ajax返回值,有三种写法,只有其中一种是成功的 /** * async:false,同步调用 * 返回1:2 * 失败 * 分析:ajax内部是一个或多个定义的函数,ajax中ret ...
- JQuery中$.each 和$(selector).each()的区别详解
PS:晚上在写页面时,发现了一个问题,$.each 和$(selector).each()有哪些区别?百度搜索关键词,首页显示出来一些前人的经验,总结一下,发上来. 1.$(selector).eac ...
- jQuery中Animate进阶用法(一)
jQuery中animate的用法你了解多少呢?如果仅仅是简单的移动位置,显示隐藏,哦!天哪你在浪费资源!因为animate太强大了,你可以有很多意想不到的用法!让我们一起研究一下吧~~ 首先要了解j ...
- jquery 中jsonp的实现原理
在同源策略下,在某个服务器下的页面是无法获取到该服务器以外的数据的,即一般的 ajax是不能进行跨域请求的.但 img.iframe .script等标签是个例外,这些标签可以通过 src属性请求到其 ...
- 解决上一篇jquery中on的疑惑
内容都是来自:http://www.365mini.com/page/jquery-on.htm.这里做一下收藏.文章的最后 疑问和解答可以解决所有的疑惑 看了之后能更好的整篇文章. on()函数 ...
随机推荐
- Python与PHP通过XMLRPC进行通信
Python与PHP通过XMLRPC进行通信:服务器端用Python,客户端用PHP. 服务器端:xmlrpc_server.py #!/usr/bin/python # coding: UTF-8 ...
- springmvc配置servlet的拦截形式/*和/的区别
今天复制一个现有的spring-mvc的项目修改配置作为新的项目,结果悲剧了!遇到了一个小问题困扰了半天,找同事找总监都没有搞定,纠结了半天终于发现了问题所在,随笔记一下,所谓好记性不如烂博客嘛! 问 ...
- 将页面打印成excel
在servlet中调用 try { File fileWrite = new File("D:/Write.xls"); fileWrite.createNewFile(); Ou ...
- linux新增用户并增加sudo权限
创建用户.设置密码: useradd testuser 创建用户testuserpasswd testuser 给已创建的用户testuser设置密码 增加sudo权限: #vi /etc/sudoe ...
- git submodule(转载)
From:http://www.worldhello.net/2010/01/26/425.html 删除 git submodule (git 库子模组) 有两种情况会创建 git submodul ...
- Linux常见命令
du -sh 查看当前文件夹大小 tail -f /var/log/nginx/access.log 查看日志 vsFTPd Linux上面的ftp df -lh 查看磁盘 df -i 查看inode ...
- Spring整合JUnit框架进行单元测试代码使用详解
一.Spring提供的JUnit框架扩展: 1. AbstractSpringContextTests:spring中使用spring上下文测试的Junit扩展类,我们一般不会使用这个类来进行单元 ...
- Java实现购物车功能:方式一:存放在session中.方式二:存储在数据库中
//将购物车产品加入到cookie中,方式同浏览记录.Java实现购物车,方式一(简易版):存储在session中.这种方式实现还不严谨,大家看的时候看思路即可.(1). JSP页面中,选择某一款产品 ...
- nyoj 82 迷宫寻宝(二)
http://acm.nyist.net/JudgeOnline/problem.php?pid=83 题目解法主要在于判断两线段是否相交,思路是穷举所有地图四周的点,其中每一个边界上的点和终点构成一 ...
- Python基础篇【第5篇】: Python内置模块(二)
内置模块 1. OS os.getcwd() 获取当前工作目录,即当前python脚本工作的目录路径 os.chdir("dirname") 改变当前脚本工作目录:相当于shell ...