如何讓event.path識別錨標籤內的元素？

爲了證明我的問題，這是我的HTML版本：如何讓event.path識別錨標籤內的元素？

<body> 
    <a href="google.com"> 
    <div> 
     <h2>Hello</h2> 
     <h4>Venus</h4> 
    </div> 
    </a> 
</body>

然後，我使用的 'onClick' 的身體在Javascript：

document.body.onclick = function(event) { 
    console.log(event.path) 
}

當我點擊 'H2' 標籤中，控制檯將僅記錄[window，html，body，a]而不是「a」標籤內的元素。

我想要的是，當我點擊「H2」的標籤，event.path將返回[窗口，HTML，身體，一個，DIV，H2]數組

這個問題也與存在的結果'p'標籤。

有沒有一種方法讓'event.path'包含'a'標籤內的元素？非常感謝你。

來源

2017-07-03 Điền Bá Quan

你可以嘗試使用jQuery的.children（）或.parent（）嗎？ –

我無法複製您的問題。它工作正常> https://jsfiddle.net/DTcHh/34438/。另外我建議不要在內聯元素中包裝塊元素。不是很好的做法。如果你在'a'或按鈕等裏面有其他的鏈接，那就禁止了 –

也許這將幫助你

function handleClicks(e) { 
 
    var path = []; 
 
    var node = e.target; 
 

 
    while(node != document) { 
 
     !e.target.contains(node.parentNode) && path.push(node.nodeName); // if you want to exclude the elements inside the clicked element 
 
     node = node.parentNode; 
 
    } 
 
    console.log(path); 
 
} 
 

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

<body> 
 
    <a href="#" id="not"> 
 
    <div> 
 
     <h2>Hello</h2> 
 
     <h4>Venus</h4> 
 
    </div> 
 
    </a> 
 
</body>

編輯

來源

2017-07-03 09:25:50

OMG！非常感謝Yordan！ :) –

請避免使用「格」錨定標記，而不是可以用「跨度」一些用戶定義的類上需要。

來源

2017-07-03 09:27:42

如何讓event.path識別錨標籤內的元素？

回答

相關問題