获取直到匹配选择器的元素的所有父级
查找元素的所有祖先,直到匹配指定选择器的元素。
- 使用
Node.parentNode
和while
循环来向上移动元素的祖先树。 - 使用
Array.prototype.unshift()
将每个新的祖先添加到数组的开头。 - 使用
Element.matches()
检查当前元素是否与指定的selector
匹配。
const getParentsUntil = (el, selector) => {
let parents = [],
_el = el.parentNode;
while (_el && typeof _el.matches === 'function') {
parents.unshift(_el);
if (_el.matches(selector)) return parents;
else _el = _el.parentNode;
}
return [];
};
getParentsUntil(document.querySelector('#home-link'), 'header');
// [header, nav, ul, li]