jQuery中closest和parents的区别分析


Posted in Javascript onMay 07, 2015

jQuery中closest和parents从表现上来看都是说查找上线元素的一些内容了,但如果说仔细可能各位不懂,下面我们一起来看看closest和parents区别。

1.父级

parent()——唯一父级元素,可能是0个或1个元素。

2.祖先

parents(selected)——所有selected祖先(不包含根元素),可能是0个、1个或多个元素。
closest(selected)——唯一selected祖先,可能是0个或1个元素。
closest和parents的主要区别是:

前者从当前元素开始匹配寻找,后者从父元素开始匹配寻找;

前者逐级向上查找,直到发现匹配的元素后就停止了,后者一直向上查找直到根元素,然后把这些元素放进一个临时集合中,再用给定的选择器表达式去过滤;

前者返回0或1个元素,后者可能包含0个,1个,或者多个元素。

closest对于处理事件委托非常有用。

总结

1、closest查找开始于自身,parents开始于元素父级
2、closest向上查找,知道找到一个匹配就停止查找,parents一直查找到根元素,并将匹配的元素加入集合
3、closest返回的是包含零个或一个元素的jquery对象,parents返回的是包含零个或一个或多个元素的jquery对象

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
Js-$.extend扩展方法使方法参数更灵活
Jan 15 Javascript
jQuery在html有效在jsp无效的原因及解决方法
Aug 02 Javascript
基于JavaScript实现网页倒计时自动跳转代码
Dec 28 Javascript
javascript实现简单的on事件绑定
Aug 23 Javascript
AngularJS 面试题集锦
Sep 06 Javascript
详解Vue中一种简易路由传参办法
Sep 15 Javascript
微信小程序之判断页面滚动方向的示例代码
Aug 30 Javascript
vue-cli配置全局sass、less变量的方法
Jun 06 Javascript
JS代码触发事件代码实例
Jan 02 Javascript
你准备好迎接vue3.0了吗
Apr 28 Javascript
javascript 代码是如何被压缩的示例代码
May 06 Javascript
Js实现粘贴上传图片的原理及示例
Dec 09 Javascript
js实现键盘上下左右键选择文字并显示在文本框的方法
May 07 #Javascript
基于jQuery.Hz2Py.js插件实现的汉字转拼音特效
May 07 #Javascript
JavaScript更改字符串的大小写
May 07 #Javascript
JQUERY简单按钮轮换选中效果实现方法
May 07 #Javascript
JS基于面向对象实现的放烟花效果
May 07 #Javascript
jquery中trigger()无法触发hover事件的解决方法
May 07 #Javascript
javascript实现的图片切割多块效果实例
May 07 #Javascript
You might like
解析thinkphp的左右值无限分类
2013/06/20 PHP
php中Session的生成机制、回收机制和存储机制探究
2014/08/19 PHP
PHP fopen中文文件名乱码问题解决方案
2020/10/28 PHP
DHTML Slide Show script图片轮换
2008/03/03 Javascript
jQuery编写widget的一些技巧分享
2010/10/28 Javascript
require.js深入了解 require.js特性介绍
2014/09/04 Javascript
js获取域名的方法
2015/01/27 Javascript
利用Angularjs和bootstrap实现购物车功能
2016/08/31 Javascript
JS实现间歇滚动的运动效果实例
2016/12/22 Javascript
微信小程序 基础组件与导航组件详细介绍
2017/02/21 Javascript
jQuery ajax实现省市县三级联动
2021/03/07 Javascript
前端框架学习总结之Angular、React与Vue的比较详解
2017/03/14 Javascript
webpack下实现动态引入文件方法
2018/02/22 Javascript
jquery实现动态改变css样式的方法分析
2019/05/27 jQuery
vue-cli打包后本地运行dist文件中的index.html操作
2020/08/12 Javascript
[34:08]2018DOTA2亚洲邀请赛3月29日 小组赛B组 VP VS EG
2018/03/30 DOTA
Python中获取网页状态码的两个方法
2014/11/03 Python
Python动态加载模块的3种方法
2014/11/22 Python
在Python中处理列表之reverse()方法的使用教程
2015/05/21 Python
使用Python简单的实现树莓派的WEB控制
2016/02/18 Python
Python实现读取文件最后n行的方法
2017/02/23 Python
利用python获取当前日期前后N天或N月日期的方法示例
2017/07/30 Python
python实现生命游戏的示例代码(Game of Life)
2018/01/24 Python
利用python实现周期财务统计可视化
2019/08/25 Python
Python钉钉报警及Zabbix集成钉钉报警的示例代码
2020/08/17 Python
python基于socket模拟实现ssh远程执行命令
2020/12/05 Python
Django用内置方法实现简单搜索功能的方法
2020/12/18 Python
python gui开发——制作抖音无水印视频下载工具(附源码)
2021/02/07 Python
css3实现垂直下拉动画菜单示例
2014/04/22 HTML / CSS
台湾网购生鲜第一品牌:i3Fresh爱上新鲜
2017/10/26 全球购物
应用电子技术专业个人求职信
2013/09/21 职场文书
中学生学习生活的自我评价
2013/10/26 职场文书
会员活动策划方案
2014/08/19 职场文书
力克胡哲观后感
2015/06/10 职场文书
房贷收入证明范本
2015/06/12 职场文书
大学生创业计划书常用模板
2019/08/07 职场文书