錯誤的目標時，按下HTML標籤中的html標籤

Question

我有四個按鈕，並希望跟蹤哪一個被按下。在其中一些中，我使用HTML標記更改了innerHTML屬性。然後我注意到，當按下按鈕時，mouseEvent.target的可用性不是按鈕，而是文本本身。這僅在按下html-tag-modified按鈕時發生。

這裏是js代碼的一部分：

for (var i = 0; i < 4; i++){   
    buttons[i].innerHTML = countries[index]["c"]; 
    buttons[i].onclick = clickHandler; 

} 

buttons[correct_btn].innerHTML = "<some-tag>" + countries[target_id]["c"] + "</some-tag>"; 

function clickHandler(me){ 
    console.log(me.target); 
} 

我希望我描述清楚的問題。我可以在沒有按鈕的HTML標籤的情況下離開，但我仍然想知道是否有辦法避免按鈕文本被定位。或者可能是我的跟蹤按鈕方法從一開始就錯了？

Answer 1

改爲使用currentTarget。從MDN：

它總是指給事件處理程序已經被附接到 ，而不是將event.target其識別在其上發生了事件

function clickHandler(me){ 
    console.log(me.currentTarget); 
} 

Here是元素的元素一個小提琴演示上述。