如何在纯javascript而不是jquery中获取第n个父元素

比如说,

<div class="panel">
   <div class="inner-panel">
      <button onclick="hideParentElement()">
        Hide
      </button>
   </div>
 </div>

这是可行的，但如果有两个以上的parentelement，则不是正确的方法。

---

请建议一个更好的方法

你必须像这样循环父母

var el = this.parentElement;
while(el.className != 'panel'){
    el = el.parentElement;
}
//el is now your parent
el.className += "classname";

---

对于纯Javascript，这是一种方法。

如果您的类列表正在动态更改：

let parent = this.parentElement;

while (!parent.classList.contains('panel'))
    parent = parent.parentElement;

parent.classList.add('classname');

---

您可以通过parentElements循环，但是您需要将类添加到哪个父级？有“panel”类的那一个？有“panel”类，但是javascript中还有其他内置函数而不是循环父元素吗？但是为什么不使用jqueryBecause根据req，整个页面应该有自定义代码，没有插件或外部文件可以包含。非常感谢您的快速回复，但我刚刚找到了一个解决方法，element.closest（“.panel”）给出了类为“panel”的父元素。我认为解决方案@varshabommarbettu可能也会给您一个兄弟姐妹或子元素。@varshabommarbettu您的解决方案实际上是正确的，API文档声明只考虑祖先（因此兄弟姐妹和子元素不应该是问题）。但是请注意，Internet Explorer不支持

最近的
方法，需要使用polyfill（所需的polyfill实际上就是我上面发布的代码）。
let parent = this.parentElement;

while (!parent.classList.contains('panel'))
    parent = parent.parentElement;

parent.classList.add('classname');