关于jQuery中的end()使用方法


Posted in Javascript onJuly 10, 2011

在官方的API上是这样描述end()方法的:“回到最近的一个"破坏性"操作之前。即,将匹配的元素列表变为前一次的状态。”;
看样子好像是找到最后一次操作的元素的上一元素,在如下的例子中:
html代码:

<div>测试内容1</div> 
<div>测试内容2</div>

jQuery代码:
$('<p>新增内容</p>').appendTo('div').addClass('c1').end().addClass('c2');

得到的结果是:
<div>测试内容1 <p class="c1 c2">新增内容</p></div> 
<div>测试内容2 <p class="c1">新增内容</p></div>

这里我就有一点不太明白了,怎么只有第一个<p>标签有两个样式,end()方法后返回的是什么,在火狐里添加了监控,得到如下结果:
1.$('<p>新增内容</p>').appendTo('div')返回的是:[p,p]对象数组,即新增后的两个p标签;
2.$('<p>新增内容</p>').appendTo('div').addClass('c1')返回的是:[p.c1,p.c1]对象数组,即添加了c1类样式后的p对象数组;
3.$('<p>新增内容</p>').appendTo('div').addClass('c1').end()返回的是[p.c1],是第1个<div>中的<p>,在2操作中,最后“破坏”的是第2个<div>中的 <p>,所以他的前一次操作的对象是第1个<div>中的<p>,返回的就是它;
4.$('<p>新增内容</p>').appendTo('div').addClass('c1').end().addClass('c2')返回的仍然是第1个<div>中的<p>;
现在算是有点明白了,关键是要搞清楚最后一次操作的元素的上一元素是什么。
Javascript 相关文章推荐
一个简单的js动画效果代码
Jul 20 Javascript
JQuery开发的数独游戏代码
Oct 29 Javascript
读jQuery之十二 删除事件核心方法
Jul 31 Javascript
jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版
Jan 11 Javascript
Web跨浏览器进程通信(Web跨域)
Apr 17 Javascript
告诉你什么是javascript的回调函数
Sep 04 Javascript
对JavaScript中this指针的新理解分享
Jan 31 Javascript
基于JavaScript实现瀑布流布局(二)
Jan 26 Javascript
详谈js中数组(array)和对象(object)的区别
Feb 27 Javascript
在微信小程序中使用vant的方法
Jun 07 Javascript
react antd表格中渲染一张或多张图片的实例
Oct 28 Javascript
详解Vue2的diff算法
Jan 06 Vue.js
动感效果的TAB选项卡jquery 插件
Jul 09 #Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
Jul 08 #Javascript
33个优秀的jQuery 教程分享(幻灯片、动画菜单)
Jul 08 #Javascript
jquery 选项卡效果 新手代码
Jul 08 #Javascript
基于jquery实现图片广告轮换效果代码
Jul 07 #Javascript
jquery调用wcf并展示出数据的方法
Jul 07 #Javascript
基于json的jquery地区联动效果代码
Jul 06 #Javascript
You might like
Smarty+QUICKFORM小小演示
2007/02/25 PHP
ajax返回值中有回车换行、空格的解决方法分享
2013/10/24 PHP
php解析json数据实例
2014/08/19 PHP
php实现爬取和分析知乎用户数据
2016/01/26 PHP
javascript中的parseInt和parseFloat区别
2013/07/12 Javascript
百度判断手机终端并自动跳转js代码及使用实例
2014/06/11 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
jQuery中trigger()方法用法实例
2015/01/19 Javascript
JavaScript设置表单上传时文件个数的方法
2015/08/11 Javascript
SpringMVC框架下JQuery传递并解析Json格式的数据是如何实现的
2015/12/10 Javascript
js实现拖拽上传图片功能
2017/08/01 Javascript
利用JS hash制作单页Web应用的方法详解
2017/10/10 Javascript
利用jQuery+localStorage实现一个简易的计时器示例代码
2017/12/25 jQuery
Angular实现的敏感文字自动过滤与提示功能示例
2017/12/29 Javascript
vue.js 实现点击展开收起动画效果
2018/07/07 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
生成无限制的微信小程序码的示例代码
2019/09/20 Javascript
基于Vue中使用节流Lodash throttle详解
2019/10/30 Javascript
pymongo实现控制mongodb中数字字段做加法的方法
2015/03/26 Python
python实现对一个完整url进行分割的方法
2015/04/29 Python
python下paramiko模块实现ssh连接登录Linux服务器
2015/06/03 Python
Django跨域请求CSRF的方法示例
2018/11/11 Python
python实现桌面托盘气泡提示
2019/07/29 Python
Python MongoDB 插入数据时已存在则不执行,不存在则插入的解决方法
2019/09/24 Python
Python 内置函数globals()和locals()对比详解
2019/12/23 Python
Python Opencv中用compareHist函数进行直方图比较对比图片
2020/04/07 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
SOA的常见陷阱或者误解是什么
2014/10/05 面试题
中专生职业生涯规划书范文
2013/12/29 职场文书
法警的竞聘演讲稿
2014/01/02 职场文书
《难忘的泼水节》教学反思
2014/02/27 职场文书
七夕活动策划方案
2014/08/16 职场文书
党员应该树立反腐倡廉的坚定意识思想汇报
2014/09/12 职场文书
公司授权委托书范文
2014/09/21 职场文书
工商局领导班子存在的问题整改措施思想汇报
2014/10/05 职场文书
2015年人事工作总结范文
2015/04/09 职场文书