检查一个元素是否是另一个元素的后代

紫微前端

于 2022-07-26 09:14:53 发布

阅读量713

点赞数

CC 4.0 BY-SA版权

分类专栏：常用代码片段文章标签： css 前端

本文链接：https://blog.youkuaiyun.com/liuhao9999/article/details/125987602

常用代码片段专栏收录该内容

168 篇文章 ¥39.90 ¥99.00

订阅专栏

本文介绍了两种方法来检查一个元素是否是另一个元素的后代：1. 使用CSS的包含方法；2. 从子元素出发，遍历到父级元素进行判断。这两种技术对于前端开发中的DOM操作和布局理解至关重要。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

假设我们要查明该child元素是否是该元素的后代parent。

1.使用包含方法

const isDescendant = parent.contains(child)

2. 从子元素上去，直到见到父级

// Check if `child` is a descendant of `parent`
const isDescendant = function (parent, child) {
    let node = child.parentNode;
    while (node) {
        if (node === parent) {
            return true;
        }

        // Traverse up to the parent
        node = node.parentNode;
    }

    // Go up until the root but couldn't find the `parent`
    return false;
};