Question

我想检查DOM元素是否是特定DIV类的子元素，而不管该元素和父DIV之间的DIV / HTML数量如何。我需要使用JavaScript（而不是jQuery）。因此，如果我有这样的HTML：

<div class="header grid-12">
  <!-- many levels of divs/html -->  
  <div class="section">
     <span id="id1">hello</span>
  </div>
</div>
<div class="footer">
  <!-- many levels of divs/html -->
  <span id="id2">goodbye</span>
</div>

我想做这样的事情（在逻辑上就是这样）：

var domID = document.getElementById("id1");
if (domID a child of 'header grid-12') {
 console.log('header grid-12 found');
}

我查看了parentNode子节点，这些子节点允许您获取所有子节点，但是我需要反向循环（如果可以的话，请返回parentnode父节点）。我认为从孩子处开始向上走要快得多，而不是从“ header grid-12”开始并遍历成百上千个节点。

谢谢

Answer 1

Element.closest()方法返回与参数中给定的选择器匹配的当前元素（或当前元素本身）的最接近祖先。如果没有这样的祖先，它将返回null。

source

尝试一下

let parent = !!document.getElementById('id1').closest('.header.grid-12');
if(parent)
{
    console.log('parent found');
}

domElement.closest('selector')相反，并返回最接近的匹配父元素。这样可以避免遍历所有domChildElements的麻烦。

使用JavaScript获取DOM元素的父级

1 个答案: