js判断是否是子元素

Text我将展示如何判断当前点击的元素是否是指定元素的子元素。

解决方案：

我为父元素分配一个 id，并使用此循环检查当前元素是否属于其子元素。

实施代码：

/**
* 前端教程网
* https://www.pipipi.net/
*/


const isDescendant = (el, parentId) => {
  let isChild = false

  if (el.id === parentId) { //判断是否是其本身
    isChild = true
  }

  while (el = el.parentNode) {
    if (el.id == parentId) {
      isChild = true
    }
  }
  
  return isChild
}

document.addEventListener('click', event => {
  const parentId = 'mycontainer'

  if (isDescendant(event.target, parentId)) {
    //处理是子元素的情况
  } else {
    //处理不是子元素的情况
  }
})

在while循环中，我使用=赋值运算符进行迭代，直到不再有父节点，在这种情况下，当el.parentNode返回null时，while循环结束。

这个解决方案想法是一个常见的解决方案。可以拿个小本子记下来~和查资料差不多。