jQuery的parent和parents和closest区别
1、parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。
2、parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。
3、closest() 方法获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上。
可以看出parent取的很明确,就是当前元素的父元素;parents则是当前元素的祖先元素。下面列出例子说明:
<div id='div1'>
<div id='div2'><p></p></div>
<div id='div3' class='a'><p></p></div>
<div id='div4'><p></p></div>
</div>
$('p').parent()取到的是div2,div3,div4
$('p').parent('.a')取到的是div3
$('p').parent().parent()取到的是div1,这点比较奇特;不过Jquery对象本身的特点决定了这是可行的。
$('p').parents()取到的是div1,div2,div3,div4
$('p').parents('.a')取到的是div3
.closest() | .parents() |
---|---|
从当前元素开始 | 从父元素开始 |
沿 DOM 树向上遍历,直到找到已应用选择器的一个匹配为止。 | 沿 DOM 树向上遍历,直到文档的根元素为止,将每个祖先元素添加到一个临时的集合;如果应用了选择器,则会基于该选择器对这个集合进行筛选。 |
返回包含零个或一个元素的 jQuery 对象 | 返回包含零个、一个或多个元素的 jQuery 对象 |
jQuery的parent和parents和closest区别的更多相关文章
- 前端开发入门到进阶附录一【JQuery中parent(),parents(),parentsUntil()区别和使用技巧】
JQuery中parent(),parents(),parentsUntil()区别和使用技巧:https://blog.csdn.net/china1223/article/details/5193 ...
- Jquery的parent和parents(找到某一特定的祖先元素)
关于Jquery的parent和parents parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以 ...
- 转:Jquery的parent和parents(找到某一特定的祖先元素)
Jquery的parent和parents(找到某一特定的祖先元素) 关于Jquery的parent和parents parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.parents则 ...
- Jquery中parent()和parents()
一.parent()方法 此方法取得匹配元素集合中每个元素的紧邻父元素,也就是第一级父元素,而不是所有的祖先元素.所取得的父元素集合也可以使用表达式进行筛选. 二.parents()方法 此方法取得一 ...
- jQuery中.parent和.parents的区别
.parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选(可选). .parents(selector) 获得当前匹配元素集合中每个元素的祖先元素,由选择器筛选(可选) ...
- JQuery包装集size,length,index,slice,find,filter,is,children,next,nextAll,parent,parents,closest,siblings,add,end,andSelf的用法
在使用Jquery包装集的知识之前首先要注意三个概念(当前包装集.新包装集.包装集内部元素)的区别. <!DOCTYPE html> <html xmlns="http:/ ...
- jQuery通过parent()和parents()方法访问父级元素
<div class="inputGroup"> <p>2.您的最高学历是?</p> <label><input type=& ...
- Jquery的parent和parents(找到某一特定的祖先元素)用法(转发:https://blog.csdn.net/cui_angel/article/details/7903704)
<!-- parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合. parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以通过一个可选的表达式进行筛选. ...
- Jquery的parent和parents(找到某一特定的祖先元素)用法
<!-- parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合. parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以通过一个可选的表达式进行筛选. ...
随机推荐
- C++中const型数据的小结
由于与对象又管的const型数据种类较多,形式又有些相似,往往难记,容易混淆,因此总结一下相关用法,具体用法可查看下方链接 C++中对象的常引用 C++中指向对象的常指针和指向常对象的指针 C++中的 ...
- 面试问题 - SQL 中存储过程与函数的区别
SQL 中的存储过程与函数没有本质上的区别 函数 -> 只能返回一个变量. 函数可以嵌入到sql中使用, 可以在select 中调用, 而存储过程不行. 但函数也有着更多的限制,比如不能使用临 ...
- URAL 2019 Pair: normal and paranormal (STL栈)
题意:在一个半圆内,有2*n个点,其中有大写字母和小写字母.其中你需要连接大写字母到小写字母,其中需要保证这些连接的线段之间没有相交. 如果能够实现,将大写字母对应的小写字母的序号按序输出. 析:我把 ...
- vue中v-if 与v-show的区别
v-if vs v-show v-if 是“真正的”条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建. v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做—— ...
- SuperSocket使用自定义协议与服务端通信发送实例
AsyncTcpSession tcpSession = new AsyncTcpSession(); public Encoding encoding = Encoding.GetEncoding( ...
- FreeSql 新功能介绍:贪婪加载五种方法
前言 FreeSql 在经过6个月的开发和朋友们的工作实践,不断的改进创新,目前拥有1500个左右单元测试方法,且每个方法内又复盖不同的测试面. 今天介绍 FreeSql 各种贪婪加载的姿势,作下总结 ...
- DOMContentLoaded时间触发与js,css,img的关联
DOMContentLoaded触发原理: 1.规范总是那么的晦涩,但至少有一点是可以明确了的,就是在JS(不包括动态插入的JS)执行完之后,才会触发DOMContentLoaded事件. 2.DOM ...
- Java中的Junit单元测试
测试方法必须使用@Test进行修饰 测试方法必须使用public void 进行修饰,不能带任何的参数 新建一个源代码目录来存放我们的测试代码 测试类的包名应该和被测试类的包名一致 测试单元中的每个方 ...
- CF446A DZY Loves Sequences 简单dp
DZY has a sequence a, consisting of n integers. We'll call a sequence ai, ai + 1, ..., aj (1 ≤ i ≤ j ...
- 洛谷P5159 WD与矩阵
题目背景 WD整日沉浸在矩阵中,无法自拔-- 题目描述 WD特别喜欢矩阵,尤其是\(01\)矩阵. 一天,CX给了WD一个巨大的\(n\)行\(m\)列的\(01\)矩阵,WD发现这个矩阵每行.每列的 ...