javascript - 原生js求DOM树的最大深度
过去多啦不再A梦
过去多啦不再A梦 2017-07-05 11:07:52
[JavaScript讨论组]

如何用原生js求DOM树的最大深度?

过去多啦不再A梦
过去多啦不再A梦

全部回复(2)
PHP中文网

递归实现

我利用了 dom 节点的 children 属性 来遍历和递归

递归套路是: 返回 (1 + 子节点们深度的最大值)

// map(e => e + 1)([0, 1, 2]) 
// => 1, 2, 3 
// 类似于数组的map方法 不过这里柯里化了 
var map = cb => arr => Array.prototype.map.call(arr, cb); 

// 取数组最大值 
// max([0, 1, 2])
// => 2 
var max = arr => arr.reduce((acc, cur) => {
    if (cur >= acc) return cur; 
    else return acc; 
}, arr[0]); 

// 递归函数 
var nextChildren = node => {
    // 基准条件 
    if (node.children.length === 0) return 1; 
    else {
        // 求子节点们的长度 并取最大值 
        var deeps = map(nextChildren)(node.children); 
        
        return 1 + max(deeps); 
    }
}

// 计算 
var $body = document.getElementsByTagName('body')[0];
var deep = nextChildren($body); 
console.log(deep); 

ScreenShot

三叔
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号