如何用原生JavaScript实现jQuery的parent()功能？

你的原生代码框架已经写对了，只需要补充两行核心逻辑就行，完整代码如下：

document.querySelectorAll('div.annotated p > span.citation').forEach((el) => {
  // 获取span的直接父元素（就是对应的p标签）
  const parent = el.parentElement;
  // 给父元素设置display样式
  parent.style.display = 'inline';
});

核心知识点解释 #

• parentElement：专门用来获取元素的直接父节点，和jQuery里的.parent()作用一模一样
• element.style.xxx：原生JS里直接操作元素行内样式的方式，这里用style.display就对应jQuery的.css('display', 'inline')

要不要继续用jQuery？ #

完全没必要。原生JS实现这个功能一点难度都没有，代码量和jQuery差不多，还能省掉加载jQuery库的时间，对页面加载速度更友好。而且现在原生JS的DOM操作API已经很完善，日常DOM操作基本都不需要依赖jQuery了。

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