关于jQuery parent find的定义
jQuery parent find方法的指定元素是由parent()函数返回的，这种方法只遍历DOM树的一个层次。Parent()类似于.parents()，除了.parent()只在DOM树上走一步路。该方法可以选择接受一个与$()函数相同类型的选择表达式。如果提供了一个选择器，元素将根据它们是否匹配而被过滤。parent()方法返回直接父元素的指定元素。这种方法只在DOM树中上升了一级。
什么是jQuery的父元素查找？
- 使用parents()或parentsUntil()方法，一路向上到文档的根元素。
- 使用children()或find()方法可以在DOM树中往下走一级或一直走到最后一个子元素。
下面是jQuery父级查找方法的语法，如下。
语法。
$(selector).parent (filter)
- 在jQuery的父级查找语法中，过滤器是一个可选的参数，用于指定父级搜索的选择器表达式。
- 父级是用来返回指定元素的直接搜索方法。所有选择元素的祖先元素，一直到文档的根元素（html>），都是由parents()方法返回。
- 在jQuery中，parent()方法检索指定选择器的所有祖先项目。这是一个内置的jQuery函数。
- 这个函数从父元素向上探索DOM树，返回所有指定元素的祖先。
- parent()和parents()方法都是沿着DOM树向上探索并返回父元素。
- 然而，parent()方法在DOM树中只往上走一层，只返回所提供的选择器的直接父元素，但是parent()方法往上走多层，返回所有的祖元素，包括祖元素、曾祖元素，等等。
- 如果过滤参数留空，这个方法将挑选一个元素集合的所有祖先，从直接父级开始，一直到html>和body>。
- 为了对搜索结果进行过滤，通常会传递一个选择短语。由于它们都是遍历DOM树，这个函数与nearest()相似。
- 在jQuery中，parent()方法是用来定位当前选择元素的父元素。在jQuery中，parent()方法在遍历了一个级别后返回所选元素。
jQuery的父元素查找是如何进行的？
- 在一个HTML文档中的一切都表示为一个Node对象。DOM树是用来与一个网页和它的资源互动。
- DOM树是以各种节点之间的父/母/子关系组织的。
- jQuery库中最著名的一个方面是DOM遍历。我们可以使用这些遍历方法轻松地遍历DOM树。
- 遍历分为三种类型，即父母、子女和兄弟姐妹。我们必须掌握DOM树中各元素之间的关系，才能发挥它的最大作用。对于所有这些组件，jQuery有大量的简单方法。
- 所选元素的直接父元素是由jQuery parent()函数返回的。
- 这是一个jQuery的内置函数，用于定位当前选定元素的父元素。
- 这个方法在向上遍历了一个单层堆栈后返回所选元素。当父元素被应用于一组项目时，它返回一个他们的直接父元素的列表。
- 使用parent()方法只需遍历HTML DOM树的一个层次。额外的过滤选项是通过可选参数提供的，它可以用来限制向下的遍历。
- 可选的是，jQuery parent find方法接受一个与$()函数相同类型的选择表达式。
- 如果提供了一个选择器，元素将被过滤，基于他们是否匹配它。
jQuery父级查找的例子
下面的例子显示，jQuery父类；查找的例子如下。
1）JQuery 父元素查找的例子，返回每个span的直接父元素 -
在下面的例子中，我们已经定义了边界颜色为浅灰色和黑色。在祖先中，我们需要定义所有的值。
代码。
<!DOCTYPE html> <html> <head> <style> .ancestors * { display: block; border: 1px solid lightgrey; color: black; padding: 4px; margin: 10px; } </style> <script> $(document).ready(function(){ $("span").parent().css({"color": "Black", "border": "1px solid Blue"}); }); </script> </head> <body> <div class="ancestors"> <div style="width:500px;"> (jQuery-Parent-method) <ul> (JQuery) <li> (Parent) <span>Method of JQuery</span> </li> </ul> </div> </body> </html>
下面的例子显示了一个jQuery parent find a方法，使用class作为selecting来寻找段落中的元素。
在下面的例子中，我们已经定义了背景颜色为红色，同时我们也定义了工作颜色为黑色。
代码。
<!DOCTYPE html> <html> <head> </head> <body> <div><p>Welcome to jQuery</p></div> <div class="selected"><p>Example of jQuery parent find</p></div> <script>$("p").parent(".selected").css ("background", "Red");</script> </body> </html>
3) JQuery parent find a method to return all ancestor elements - 父级元素查找方法
下面的例子显示了jQuery父类查找方法返回所有的祖先元素，如下所示。
- 在下面的例子中，我们已经定义边界颜色为浅灰色，也定义了颜色为浅灰色。在祖先中，我们需要定义所有的值。
代码。
<!DOCTYPE html> <html> <head> <style> .ancestors * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 4px; margin: 10px; } </style> <script> $(document).ready (function (){ $("span").parent().css ({"color": "Black", "border": "1px solid Blue"}); }); </script> </head> <body class="ancestors"> (JQuery) <div style="width:500px;"> (Parent) <ul> (Find) <li> (Method) <span>JQuery</span> </li> </ul> </div> </body> </html>
总结
在jQuery中，parent()方法是用来定位当前选定元素的父元素。在jQuery中，parent()方法在遍历了一个级别后返回所选元素。parent()方法返回直接父元素的指定元素。
推荐文章
这是一个关于jQuery父元素查找的指南。在这里，我们讨论了定义，语法，什么是jQuery的父元素查找，如何工作，以及代码的例子。你也可以看看下面的文章来了解更多------。
