为什么我使用 Javascript 得到错误的 div 子节点数？答案

【问题标题】：Why i get wrong number of child of div with Javascript?为什么我使用 Javascript 得到错误的 div 子节点数？
【发布时间】：2017-08-07 08:20:42
【问题描述】：

var count = $("#abc").length;
console.log('Count : ' + count)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="display:none;" id="abc"></div>

我得到结果 = 1。这是为什么呢？ div没有孩子？如何解决此问题以获得正确数量的孩子？

【问题讨论】：

您正在获取 id 为 abc 的元素的长度，将子元素添加到选择器以计算子元素
jQuery count child elements的可能重复
$(selector).length 是选择器选择的元素的数量...... HTML 元素没有 .length 属性 - 你看到的是 jquery 对象的长度 - 绝对没有使用 DOM
根据答案我的问题是因为我没有将 .children() 添加到语法中。谢谢大家

【解决方案1】：

您直接选择#abc 元素，因此长度属性将始终为1。如果要获取元素的子元素个数，使用children().length：

var count = $("#abc").children().length;
console.log('Count:', count);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="display:none;" id="abc"></div>

【讨论】：

【解决方案2】：

var count= $("#abc").children().length;
console.log('Count : '+count)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="display:none;" id="abc">

</div>

您正在获取 id 为 abc 的元素的长度将子元素添加到选择器以计算子元素

【讨论】：

【解决方案3】：

为什么我得到 result = 1，但 div 没有孩子？

因为 jQuery 对象的 .length 属性返回该 jQuery 对象中元素的数量。该数字为 1，因为您选择了 div。

如何解决它以获得正确的孩子数量？

var count = $("#abc").children().length;

【讨论】：

【解决方案4】：

你必须先使用 children() 方法找到元素的子元素，然后使用长度计算子元素的数量。

所以你的表达应该是

var count = $('#abc').children().length;
console.log('Count: '+count);

【讨论】：