如何将链式调用的jQuery方法转换为原生JavaScript？

以下是和你提供的jQuery代码功能完全等价的原生JS代码：

// 找到匹配href的链接
const matchingLink = Array.from(document.querySelectorAll('.menu a')).find(link => link.href === url);
// 确保找到元素后再执行后续操作，避免报错
if (matchingLink) {
  // 找到最近的父级li并添加active类
  matchingLink.closest('li').classList.add('active');
}

代码说明： #

• document.querySelectorAll('.menu a')：获取所有.menu容器下的<a>元素，对应jQuery的$('.menu a')
• Array.from(...).find(...)：将NodeList转为数组后，筛选出href与目标url完全匹配的第一个链接，对应jQuery的.filter()方法（如果需要处理多个匹配项，可将find替换为filter并遍历结果）
• .closest('li')：原生DOM元素的closest()方法和jQuery同名方法功能一致，会向上查找最近的匹配父元素
• .classList.add('active')：为元素添加指定类名，对应jQuery的.addClass('active')

内容的提问来源于stack exchange，提问作者Kinglybird