Question

在以下代码中，当点击 Hello 时，有没有办法允许所有内容都接收事件减去div？

HTML：

<html>
<body>
<div>
    <h1>
        <a href="#">
            <span>Hello</span>
        </a>
    </h1>
</div>
</body>
</html>

JavaScript：

window.addEventListener("load", function () {
    var els = document.querySelectorAll("*");
    for (var i = 0; i < els.length; i++) {
        els[i].addEventListener("click", function () {
            alert('Click event fired on the ' + this.nodeName + ' element');
        });
    }
});

JSFiddle

Answer 1

您可以使用*:not(div)选择器：

var els = document.querySelectorAll("*:not(div)")

JSFiddle

Answer 2

您已添加jQuery作为标记，为什么不使用它？以下修改了您的示例：

http://jsfiddle.net/DW6Jn/85/

$(function(){
    $('span').click(function(){
        alert('Click event fired on the ' + this.nodeName + ' element');
    })
});

这不应该冒泡，不再循环，jQuery为你提供了更清晰的目标元素:)

更新

要听取<h1>所有小孩的意见，请听h1 ..就像这样：

http://jsfiddle.net/DW6Jn/86/

有没有办法防止jQuery事件冒泡到特定的div？

JSFiddle

2 个答案:

JSFiddle