JavaScript子元素计数函数报错Uncaught TypeError：无法读取length属性

错误原因 #

你调用countChildElements(ev)时，传入的ev是事件对象（Event），而非DOM元素节点。事件对象本身没有childNodes属性，所以parent.childNodes会返回undefined，尝试读取undefined.length就会抛出Uncaught TypeError。

修复方案 #

你需要把触发事件的DOM元素传给统计函数，有两种简单实现方式：

方式1：通过事件对象获取目标元素 #

修改thing函数，用event.currentTarget拿到触发事件的<a>元素：

function thing(ev) {
  alert(countChildElements(ev.currentTarget));
}

方式2：直接传入this #

在HTML的onclick属性里，this指向当前触发事件的DOM元素，直接传this即可：

<a onclick="thing(this)">
  <p>hi</p>
  <p>2 children in this element (including this)</p>
</a>

对应的JS函数无需改动，此时传入的是合法的DOM元素。

关于.length报错的补充 #

你提到“任何地方使用.length都会触发相同的错误”，本质是你操作的变量不是数组、DOM节点列表这类具备length属性的对象，而是undefined或null。只要确保调用.length的变量是合法的可迭代对象，就不会出现该错误。

内容的提问来源于stack exchange，提问作者Person12343