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

Question

例如，

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

如果我想将一个类添加到最外层的分区，我需要获取该元素并向其添加一个类。如何使用纯 JavaScript 来实现这一点？

我已经尝试过以下方法：

this.parentElement.parentElement.classList.add("classname");

这是可行的，但如果有超过 2 个parentElements，则不是正确的方法。请建议更好的方法

Answer 1

你必须像这样循环父母。

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

对于纯 Javascript，这就是实现的方法。