javascript - 如何找出哪个父级包含属性？

Question

这个问题已经有答案了:

What is the pure JavaScript equivalent of jQuery's .parents() method? [duplicate] (2 个回答)

已关闭 去年。

一个问题:如何找出哪个父级包含属性？示例:

     <div custom-attribute>
      <div>
       <div>
        <div>
         <div><p>some text</p></div>
        </div>
       </div>
      </div>
     </div>

我无法确切知道该属性将应用于何处以及哪个元素。我需要遍历<p>中的所有 parent 元素。

没有jquery

Answer 1

使用 while 循环迭代父级，直到找到具有该属性的父级:

const elem = document.getElementById('elem');
let parent = elem.parentElement;

while (parent && !parent.hasAttribute('custom-attribute')) {
  parent = parent.parentElement;
}

if (parent) {
  console.log(parent);
}

<div custom-attribute>
  <div>
    <div>
      <div>
        <div>
          <p id="elem">some text</p>
        </div>
      </div>
    </div>
  </div>
</div>