Могу ли я проверить несколько предков в JavaScript с помощью Element.closest ()?
У меня подробное условие:
if (
(e.target.parentNode.classList[0] === 'my-class') ||
(e.target.parentNode.parentNode.classList[0] === 'my-class') ||
(e.target.parentNode.parentNode.parentNode.classList[0] === 'my-class')
) {
/* [... CODE HERE...] */
}
В некоторых контекстах я легко могу представить себе, что условие распространяется на 5 или более строк.
Я знаю, что могу написать рекурсивную функцию, которая проверяет, не является ли следующий вышележащий узел-предок <body>, и, если нет, запускает ту же рекурсивную функцию на этом узле.
Но учитывая, что Element.closest() существует:
Видеть:https://developer.mozilla.org/en-US/docs/Web/API/Element/closest
есть ли более простой способ написать условие, что-то вроде:
if (e.target.closest('.my-class') !== false) {
/* [... CODE HERE...] */
}
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Из резюме:
If there isn't such an ancestor, it returns
null.
Так:
if (e.target.closest('.my-class') !== null)
В случае, если e.target сам может быть .my-class, и вы хотите исключить это, вам нужно начать с родительского элемента:
if (e.target.parentNode.closest('.my-class') !== null)
но если гарантировано, что e.target никогда не будет .my-class, первого примера будет достаточно.