【Javascript框架】jquery获取父级元素parents()和closest()

2013-04-28 04:44 阅读 1,352 次 评论关闭

jqueryparents()查找父级元素删除的时候,发现它不包含根元素,于是用了closest(),效果不错,但是两者是有区别的,请看:

<ul class="box" name="a">

<li name="b" class="li_moito"><p><a href="#" class="moto">Hello Moto</a></p></li>

</ul>

 

如果要获取class="moto"的父级元素LI,可以用$(".moto").parent().parent()。但是比较繁琐,

实想要获取父级标签还有另外两种方法的,即parents()与closest()。

 

parents()方法:

parents(),我想这个大家再熟悉不过了,它是取得所有符合条件的祖先元素(不包括本身),这是一个集合。

这里,我们可以:

$(".moto").parents("li[name='b']");

或者

$(".moto").parents(".li_moito");

 

closest()方法:

closest(),这个方法呢就是向上检查元素并逐级匹配。首先,会从自身来匹配,匹配成

 

功就返回本身;不成功则向上寻找,直到找到匹配的选择器为止。如果没有则返回空对象。

可以这样写:

$(".moto").closest("li[name='b']");

或者

$(".moto").closest(".li_moito");

 

 

区分parents()与closest()

1、前者从父级开始匹配元素;而后者是从自身开始。

2、前者向上查找所有的父级元素,直至根元素,然后把这些查找的结果放到一个临时

的集合中,再通过额定的条件来进行筛选;后者是从自身元素开始向上查找,直到找到有效的匹配元素就停止。

3、前者返回元素值可以有0个、1个,或者是多个;后者只有0个或1个;

因此使用者需更具需求来使用parents()和closest()。

版权声明:本文著作权归原作者所有,欢迎分享本文,谢谢支持!
转载请注明:【Javascript框架】jquery获取父级元素parents()和closest() | 猎微网

评论已关闭!