是否可以使用 event.target 以元素父元素为目标?

2022-08-30 04:58:00

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

<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;
}

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

我想实现的是,当我点击元素中的任意位置时,它将采用整个元素的内部HTML,而不是我点击的特定元素。<section>

我假设这与选择单击的父元素有关,但我不确定,也无法在线找到任何内容。

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


答案 1

我认为您需要的是使用.这将包含实际具有事件侦听器的元素。因此,如果整个事件列表器将是单击的元素,则将在 .event.currentTarget<section>event.target<section>event.currentTarget

否则可能是您要查找的内容。parentNode

链接到当前目标
链接到父节点


答案 2

要使用元素的父级,请使用:parentElement

function selectedProduct(event){
  var target = event.target;
  var parent = target.parentElement;//parent of "target"
}