是否有 JS/jQuery 完全递归子节点计数功能？

Question

各位，

假设我有以下情况：

<div class="outer">
    <div>
        <span>
             <ul>
                 <div> </div>
                 <div> </div>
             </ul>
         </span>
     </div>
  </div>

我如何找到 div.outer 内的元素总数？像 $('div.outer').children().size() 或 length 返回 1 （我正在寻找，在本例中为 5）之类的东西是否有一个快捷方式或函数可以使用 js/ 查找总元素数jQuery 还是我应该专门针对这个问题编写一个函数？ TIA。

Answer 1

vartotalDesendants = $('div.outer *').length;

就完成了。

---

var totalDescendants = $('div.outer').find('*').length;

也可以。

Answer 2

一个简单（并且可能比 jQuery 更快）的 JavaScript 替代方案是：

var el = document.getElementById("foo");
var descendantElementCount = el.getElementsByTagName("*").length;

这确实假设您已经给了元素一个 id。如果这很重要，您可以使用 jQuery 获取具有类 outer 的所有元素：

var descendantElementCount = 0;
$('div.outer').each(function() {
    descendantElementCount += this.getElementsByTagName("*").length;
});

Answer 3

jQuery 递归子节点计数函数：

jQuery(document).ready(function(){
var TotalChildren=jQuery("*","div.outer").length;
});