Javascript $（*）。单击事件单击它及其所有父项。

这是我的代码：

<p>
    <div>
        <div><span>Hello</span></div>
        <span>Hello Again</span>
    </div>
    <div>
        <span>And Hello Again</span>
    </div>
</p>
<b>Click Hellos to toggle their parents.</b>
<script>
    function showParents() {
        $("div").css("border-color", "white");
        var len = $("span.selected")
        .parents("div")
        .css("border", "2px red solid")
        .length;
        $("b").text("Unique div parents: " + len);
    }
    $("*").click(function () {
        $("b").text($(this).parents().length);
    });
</script>

你好
你好
再次问好

单击“你好”以切换其家长。
函数showParents（）{
$（“div”）.css（“边框颜色”、“白色”）；
变量len=$（“选定范围”）
.家长
.css（“边框”，“2倍红色实心”）
.长度；
$（“b”）.text（“唯一div父项：”+len）；
}
$（“*”）。单击（函数（）{
$（“b”）.text（$（this.parents（）.length）；
});

问题是当我点击一个跨度时，显示的是0而不是3

我认为问题在于

*

---

现在的问题是，当我不知道元素的类型时，如何获得父计数？

问题是事件传播（冒泡）。click事件从触发与这些祖先元素关联的每个click处理程序的clicked元素传播到文档的根，因此当触发

html

元素的click处理程序时，不再有父元素，因此结果为0

演示：-看看控制台

相反，您可以仅将单击处理程序绑定到文档对象，然后使用事件的target属性查找触发单击的元素并查找其父元素

$(document).click(function (e) {
    $("b").text($(e.target).parents().length);
});

---

演示：

原因如下：

*

上的click（）工作方式是从单击的元素开始对DOM中的每个元素执行操作，然后“向上”（或冒泡），因为

是树中的第一个元素，它没有父元素。tanx伙计，我知道了：）