嵌套 javascript 最近的更好方法（不是 jQuery）

Question

我用香草javascript，没有jQuery。

在我的代码中，我有一些看起来像这样的东西：

item.closest('ul').closest('li').closest('ul').classList.add('active');

虽然它有效，但看起来并不那么好。我重复closest三遍

在这种情况下是否可以做一些更聪明的事情？

Answer 1

没有标准的方法可以缩短它。

您可以：

向您要 select 的元素添加 class。这将使您的 selector 看起来像这样： item.closest('ul.myClass').classlist.add('active')

创建一个包装 closest 链创建的函数：

function closestChain(item) {
    return Array.from(arguments).reduce((acc, val) => {
        return acc.closest(val);
    });
}

closestChain(item, 'ul', 'li', 'ul').classlist.add('active');

或者您可以等待 has CSS selector 可用

嵌套 javascript 最近的更好方法（不是 jQuery）

Better way to nest javascript closest (not jQuery)

javascript

nested

closest