可以使用 event.target 来定位元素的父元素吗？

我试图改变我的页面的 innerHTML 成为我点击的元素的 innerHTML，唯一的问题是我希望它采取整个元素，如:

<section class="homeItem" data-detail="{"ID":"8","Name":"MacBook Air","Description":"2015 MacBook A…"20","Price":"899","Photo":"Images/Products/macbookAir.png"}"></section>

然而我用 javascript 写的代码:

function selectedProduct(event){
target = event.target;
element = document.getElementById("test");
element.innerHTML = target.innerHTML;
}

将针对特定的元素，我点击。

我想要实现的是，当我点击 <section>元素中的任何地方，它将采取整个元素的 innerHTML，而不是具体的一个，我已经点击。

我会假设这是一些与选择父元素的一个被点击，但我不确定，无法在线找到任何东西。

如果可能的话，我想远离 JQuery

271412 次浏览
小开

要使用元素的父元素，请使用 parentElement:

function selectedProduct(event){
var target = event.target;
var parent = target.parentElement;//parent of "target"
}
小开
最佳答案

我认为你需要的是使用 event.currentTarget。这将包含实际具有事件侦听器的元素。因此，如果整个 <section>都有 event 侦听器 event.target将是被点击的元素，那么 <section>将位于 event.currentTarget中。

否则 parentNode可能就是你要找的。

链接到 currentTarget
父节点的链接

小开 
function getParent(event)
{
return event.target.parentNode;
}

例子: 1. document.body.addEventListener("click", getParent, false);返回您单击的当前元素的父元素。

  1. 如果你想在任何函数中使用，那么传递你的事件并像这样调用函数: 函数(事件){ Var ParentElement = getParent (event) ; }
小开 
var _RemoveBtn = document.getElementsByClassName("remove");
for(var i=0 ;  i<_RemoveBtn.length ; i++){
_RemoveBtn[i].addEventListener('click',sample,false);
}
function sample(event){
console.log(event.currentTarget.parentNode);
}
小开 
handleEvent(e) {
const parent = e.currentTarget.parentNode;
}
小开 
$(document).on("click", function(event){
var a = $(event.target).parents();
var flaghide = true;
a.each(function(index, val){
if(val == $(container)[0]){
flaghide = false;
}
});
if(flaghide == true){
//required code
}
})

提交答案