如何检查事件冒泡传播树中是否存在元素？

Question

有没有其他方法可以做到这一点？

hammertime.on('pan', function(e) {
  if(e.target.classList.contains("disableEvent")) return false
  if(e.target.parentElement?.classList?.contains("disableEvent")) return false
  if(e.target.parentElement?.parentElement?.classList?.contains("disableEvent")) return false
  move()
}

即检查 e.target 是否在具有 class disableEvent 的元素内。

Answer 1

您可以使用与 class 匹配的选择器调用 .closest()。

hammertime.on('pan', function(e) {
  if (!e.target.closest(".disableEvent")) {
    move();
  }
});

Answer 2

一个万无一失的方法是递归地不断检查节点的父节点；

function hasParentWithMatchingSelector (target:Node, selector:string) {
    const allSubMenus : NodeListOf<Element> = document.querySelectorAll(selector) 
    let myArray = Array.from(allSubMenus)
    return [...myArray].some(el =>
      el !== target && el.contains(target)
    )
  }

福利包括检查其他事情。

如何检查事件冒泡传播树中是否存在元素？

How to check if an element is present in the event bubbling propagation tree?

javascript

dom-events