Как проверить, является ли элемент потомком другого

Мне нужно было выяснить, что элемент, который я получил через событие щелчка, был потомком определенного родительского элемента.

Я назначил идентификатор этому родителю и проверил, принадлежит ли выбранный элемент его дочерним элементам, используя этот цикл:

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

  if (el.id === parentId) { //is this the element itself?
    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)) {
    //it is a descendant, handle this case here
  } else {
    //it's not a descendant, handle this case here
  }
})

В цикле while мы используем оператор присваивания = для итерации до тех пор, пока родительский узел больше не исчезнет, в этом случае el.parentNode возвращает нуль и цикл while заканчивается.

Это способ подняться “вверх” по дереву элементов, пока оно не закончится.

Оригинал: “https://flaviocopes.com/how-to-check-element-descendant/”