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

Question

民间，

假设我有以下情况：

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

我如何找到div.outer中的元素总数？类似$（'div.outer'）。children（）。size（）或者长度返回1（我看，在这种情况下，为5）有一个快捷方式或函数来查找使用js /的总元素数jQuery还是我应该为这个问题编写一个函数？ TIA。

Answer 1

var totalDescendants = $('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; });