在jQuery中查找元素的所有后代
时间：2020-02-23 14:45:59 来源:igfitidea点击:
在本文中，我们将讨论一种重要的jQuery遍历方法，以查找元素的所有后代。
jQuery API提供了" find()"方法来执行此任务。
jQuery find()方法
jQuery find()方法返回所有后代元素，例如child，孙子等等。
如果要搜索DOM树中更深的所有元素，则使用此方法。
此方法向下遍历并找到所选元素的所有后代。
此方法采用强制性过滤参数以缩小搜索范围。
这是使用find()方法的一般语法：
- 选择器。
查找(过滤器)
filter是传递给find()方法的必需参数。
filter可以是任何字符串选择器表达式，元素或者jQuery对象。
jQuery find()示例
以下示例演示了jQuery find()方法的用法。
<!doctype html>
<html>
<head>
<title>jQuery Traversing find</title>
<style>
.highlight{
background: yellow;
}
div{
display: block;
border: 3px solid black;
color: black;
padding: 5px;
margin: 25px;
width:250px;
}
span{
display: block;
border: 3px solid green;
color: black;
padding: 5px;
margin: 25px;
width:200px;
}
</style>
<script src="https://code.jquery.com/jquery-2.1.1.js"></script>
</head>
<body>
<h2>jQuery find() demo</h2>
<div>div
<p> p - I am div's child</p>
span <p>p - I am span's Child and div's Grand Child</p>
</div>
<script>
$( "div" ).find( "p" ).addClass("highlight");
</script>
</body>
</html>
在此示例中，您可以看到两个p元素，一个元素是div元素的孩子，另一个是孙子。
find()方法查找所选div元素中的所有p元素，并将颜色更改为红色。
下图显示了以上HTML页面产生的输出。
您可以使用selector.find(" *")"查找HTML文档的所有后代。
