元素/对象上的多个属性

Question

谁能解释一下这是如何工作的？ => let li = event.target.parentNode;所以event.target是对事件调度程序的引用，我知道.parentNode返回指定节点元素的父节点等。但整个事情如何协同工作？这些事情是按顺序发生的，也可以将它们加在一起或什么东西？

listDiv.addEventListener("click", (event) => {
  if(event.target.tagName === "BUTTON") {
  let li = event.target.parentNode ;
  let ul = li.parentNode ;
  ul.removeChild(li) ;
}
}) ;

Answer 1

tl;dr event.target是开始这一事件的元素，parentNode是该元素的父母。

整个过程都是这样的 - event是一个对象，包含有关被触发事件的所有相关信息，包括target（事件的目标）等。这是触发元素的元素（例如，单击的按钮）。这具有您可能选择的任何其他元素的所有属性（使用document.getElementById或document.querySelector） - 因此，它具有parentNode属性，该属性引用位于其上一级的DOM节点。