最新的Web开发教程
 

jQuery parents() Method

<jQuery的遍历方法

返回的所有祖先元素<span>

$(document).ready(function(){
    $("span").parents().css({"color": "red", "border": "2px solid red"});
});

结果:

body (great-great-grandparent)
div (great-grandparent)
    ul (grandparent)
  • li (direct parent) span
试一试»

定义和用法

parents()方法返回所选元素的所有祖先元素。

祖先是父母,祖父母,曾祖父母,依此类推。

DOM树:此方法从父元素遍历向上沿DOM元素的祖先,直到文档的根元素一路(<html>)

注意:如果过滤参数为空,这个函数将选择一组元素的所有祖先,从直接父并一路到<body><html> 因此,常常是有用的,以传递一个选择器表达式来缩小搜索结果。

此方法类似于closest()因为它们既向上遍历DOM树。 的不同之处如下:

parents()

  • 与父元素开始
  • 游记了DOM树,并返回所传递的表达式匹配所有祖先
  • 返回的jQuery对象包含零或一个以上的元素

closest()

  • 与当前元素开始
  • 游记了DOM树,并返回所传递的表达式匹配的始祖
  • 返回的jQuery对象包含零或一个元素

其他相关的方法:

  • parent() -返回所选元素的直接父元素
  • parentsUntil() -返回两个给定的参数之间的所有祖先元素

句法

$(selector).parents( filter )

参数 描述
类=“notranslate”新增过滤器 可选的。 指定选择器表达式来缩小为祖先搜索

注意:要返回多个祖先,每个表达式用逗号分隔。

试一试 - 示例

缩小搜索范围
如何使用过滤器参数返回的所有祖先<span><ul>元素。

返回多个祖先
如何使用过滤器参数返回的所有祖先<span><li><div>元素。

显示元素的按标签名祖先
演示,显示一个谁的祖先<span>元素实际上是。


<jQuery的遍历方法