jQuery 后代 - 蝴蝶教程

jQuery 遍历 - 后代

使用jQuery，您可以遍历DOM树以查找元素的后代。

后代是孩子，孙子，曾孙等等。

遍历 DOM 树

遍历DOM树的两个有用的jQuery方法是：

children()
find()

jQuery children()方法

children()方法返回所选元素的所有直接子元素。

此方法仅遍历DOM树中的单个级别。

以下示例返回作为每个<div>元素的直接子元素的所有元素：

   
            <head>
                <script type="text/javascript" src="jquery.js"></script>
                <script type="text/javascript">
                    $(document).ready(function(){
                        $("div").children();
                    });
                </script>
            </head>

尝试一下

您还可以使用可选参数来过滤搜索子项。

以下示例返回类名为“first”的所有<p>元素，它们是<div>的直接子元素：

   
            <head>
                <script type="text/javascript" src="jquery.js"></script>
                <script type="text/javascript">
                    $(document).ready(function(){
                        $("div").children("p.first");
                    });
                </script>
            </head>

尝试一下

jQuery find()方法

find()方法返回所选元素的后代元素，一直到最后一个后代。

以下示例返回作为<div>后代的所有<span>元素：

   
                <head>
                    <script type="text/javascript" src="jquery.js"></script>
                    <script type="text/javascript">
                        $(document).ready(function(){
                            $("div").find("span");
                        });
                    </script>
                </head>

尝试一下

以下示例返回<div>的所有后代：

   
                <head>
                    <script type="text/javascript" src="jquery.js"></script>
                    <script type="text/javascript">
                       $(document).ready(function(){
                            $("div").find("*");
                        });
                    </script>
                </head>

尝试一下

有关所有jQuery遍历方法的完整概述，请转到我们的jQuery遍历参考手册。