javascript - 通过类或名称获取嵌套子项的父元素

我有类似html的元素，具有未知的层次结构:

<div class="parent" name="parent">
  <div>
    <div>
      <div>
        <div onclick="get_parent(this)">
          Nested Child 1
        </div>
      </div>
    </div>
  </div>
</div>

<div class="parent" name="parent">
  <div>
    <div onclick="get_parent(this)">
      Nested Child 2
    </div>
  </div>
</div>

有什么简单的方法可以按类(class)或名称来获取嵌套 child 的 parent ？

也许child.parentElement或child.parentNode有一些我不知道的替代方法可能对我有帮助？

还是遍历所有 parent 直到我需要class或name是唯一的选择？

最佳答案

您可以尝试的纯JS唯一解决方案!

function getParent(ele, parentClass="parent"){
   var e = ele;
   while(!e.classList.contains(parentClass)){
      e=e.parentElement;
   }
   console.log(e);
   return e;
}

<div class="parent">
   <div>
      <div>
         <div>
            <div onclick="getParent(this)">CHILD 1</div>
         </div>
      </div>
   </div>
</div>


<div class="second_parent">
    <div>
        <div onclick="getParent(this,'second_parent')">CHILD 2</div>
    </div>
</div>

关于javascript - 通过类或名称获取嵌套子项的父元素，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/60246194/