[Javascript] 确定DOM事件冒泡中的事件路径


Answers

function handleClicks(e) {
    var path = [];
    var node = e.target;
    while(node != document.body) {
       path.push(node);
       node = node.parentNode;
    }
    console.log(path);
}

document.body.addEventListener('click', handleClicks);
Question

我正试图找出一个事件冒泡的路径。 例如,我有一个标记

 <div id="container" onclick="func">
        <div id="div1"></div>
        <div id="div2">
            <div id="div2.1"></div>
            <span id="span2.2"></span>
            <div id="div2.3">
                <button id="btn2.3.1"></button>
            </div>
        </div>
    </div>

现在如果点击btn2.3.1,我希望看到事件已经冒泡的整个路径是btn2.3.1 - > div2.3 - > div2 - > container。 有没有办法做到这一点只在容器上放置一个处理程序? (请不要Jquery)

我发现了一个event.path数组。这个东西,但没有找到很多关于它的细节。它是跨浏览器? 什么是实现这一目标的正确方法?