javascript - 原生js求DOM樹的最大深度
問題描述
如何用原生js求DOM樹的最大深度?
問題解答
回答1:遞歸實(shí)現(xiàn)我利用了 dom 節(jié)點(diǎn)的 children 屬性 來遍歷和遞歸
遞歸套路是: 返回 (1 + 子節(jié)點(diǎn)們深度的最大值)
// map(e => e + 1)([0, 1, 2]) // => 1, 2, 3 // 類似于數(shù)組的map方法 不過這里柯里化了 var map = cb => arr => Array.prototype.map.call(arr, cb); // 取數(shù)組最大值 // max([0, 1, 2])// => 2 var max = arr => arr.reduce((acc, cur) => { if (cur >= acc) return cur; else return acc; }, arr[0]); // 遞歸函數(shù) var nextChildren = node => { // 基準(zhǔn)條件 if (node.children.length === 0) return 1; else {// 求子節(jié)點(diǎn)們的長(zhǎng)度 并取最大值 var deeps = map(nextChildren)(node.children); return 1 + max(deeps); }}// 計(jì)算 var $body = document.getElementsByTagName(’body’)[0];var deep = nextChildren($body); console.log(deep); ScreenShot
相關(guān)文章:
1. javascript - 原生canvas中如何獲取到觸摸事件的canvas內(nèi)坐標(biāo)?2. showpassword里的this 是什么意思?代表哪個(gè)元素3. mysql scripts提示 /usr/bin/perl: bad interpreter4. css3 - css怎么實(shí)現(xiàn)圖片環(huán)繞的效果5. html - vue項(xiàng)目中用到了elementUI問題6. 對(duì)mysql某個(gè)字段監(jiān)控的功能7. android - 用textview顯示html時(shí)如何寫imagegetter獲取網(wǎng)絡(luò)圖片8. JavaScript事件9. css3 - border-bottom 的長(zhǎng)度可否超過盒子的寬度呢?實(shí)現(xiàn)如下圖效果。(我的書下面的線)10. mysql優(yōu)化 - mysql EXPLAIN之后怎么看結(jié)果進(jìn)行優(yōu)化 ?
