主体函数

export function findAllParent (node, tree, parentNodes = [], index = 0) {
if (!node || node.fid === 0) {
return
}
findParent(node, parentNodes, tree)
let parentNode = parentNodes[index]
findAllParent(parentNode, tree, parentNodes, ++index)
return parentNodes
} function findParent (node, parentNodes, tree) {
for (let i = 0; i < tree.length; i++) {
let item = tree[i]
if (item.id === node.fid) {
parentNodes.push(item)
return
}
if (item.children && item.children.length > 0) {
findParent(node, parentNodes, item.children)
}
}
} export default findAllParent

调用方式

import findParentNodes from './test'
let menuTreeData = [
  {
    id: 1,
    fid: 0,
    name: '1',
    children: [
{
id: 11,
fid: 1,
name: '1-1',
children: [
{ id: 111, fid: 11, name: '1-1-1' },
{ id: 112, fid: 11, name: '1-1-2' }
]
},
      { id: 12, fid: 1, name: '1-2' }
    ]
  },
  { id: 2, fid: 0, name: '2' }
]
let nodes = []
let parentNodes = findParentNodes({ id: 112, fid: 11 }, menuTreeData, nodes)
console.error('tag', nodes.map(item => item.name))
console.error('tag', parentNodes.map(item => item.name))

两种方式都可以获取到祖先节点的值

JS获取树的父节点及祖先节点的更多相关文章

  1. jQuery之防止冒泡事件,冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件。

    冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. 下面是html代码部分: <body> <div id="content"> 外层div元素 ...

  2. JS 查找数组的父节点及祖先节点

    function findAllParent(node, tree, parentNodes=[], index = 0){ if(!node || node.parentId === 0){ ret ...

  3. js获取iframe和父级之间元素,方法、属,获取iframe的高度自适应iframe高度

    摘自:http://blog.csdn.net/kongjiea/article/details/38870399 1.在父页面 获取iframe子页面的元素 (在同域的情况下 且在http://下测 ...

  4. MySql获取树型结构的所有子节点

    stackoverflow的解决方案,亲测有效: SELECT * FROM person WHERE department IN (SELECT department_id FROM departm ...

  5. CSS 子节点继承父节点(祖先节点)的样式

    CSS 有些属性可以让子节点从父节点或祖先节点继承,文本.字体.列表属性等样式都可以被子节点继承.子节点没有自身的样式,子节点将继承父节点或祖先节点的样式. <ul class="co ...

  6. JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)

    先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...

  7. JS获取与遍历节点的兄弟父级

    发布:脚本学堂/JavaScript  编辑:JB01   2014-01-23 15:40:11  [大 中 小] 介绍下js获取节点的兄弟.父级与子元素的方法,学习下js遍历节点的操作方法,有需要 ...

  8. JS获取节点的兄弟,父级,子级元素

    https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...

  9. 总结获取原生JS(javascript)的父节点、子节点、兄弟节点

    关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...

随机推荐

  1. JavaFile I/O流

    Java 流(Stream).文件(File)和IO Java.io 包几乎包含了所有操作输入.输出需要的类.所有这些流类代表了输入源和输出目标. Java.io 包中的流支持很多种格式,比如:基本类 ...

  2. 🔥🔥🔥Flutter 字节跳动穿山甲广告插件发布 - FlutterAds

    前言 Flutter 已成为目前最流行的跨平台框架之一,在近期的几个大版本的发布中都提到了 Flutter 版本 Google 广告插件 [google_mobile_ads] .对于"出海 ...

  3. shell脚本 系统信息检测

    一.简介 源码地址 日期:2018/4/12 介绍:根据指令展示不同的系统数据 效果图: 二.使用 适用:centos6+ 语言:中文 注意:无 下载 wget https://raw.githubu ...

  4. JSONP是个嘛玩意?解决跨域问题?

    浏览器同源策略 限制js向 其他域名发起请求,浏览器调试报错如下 JSONP 是一种解决方法 浏览器不会阻止带有src属性的标签发请求.所以可以常用的 <script src="xxx ...

  5. ubuntu16.04 开启ipv6支持

     1)vim /etc/default/grub将GRUB_CMDLINE_LINUX中下面的这一项删除:ipv6.disable=12)执行 grub-mkconfig -o /boot/grub/ ...

  6. ajaxFileUpload上传文件成功后却无法解析服务器返回的json数据

    可能是应该返回内容带了标签,过滤下 var index=data.indexOf("<"); if (index!=-1){ data=data.substring(0,in ...

  7. git提交报错:Error merging: refusing to merge unrelated histories

    执行: git pull origin master --allow-unrelated-histories 然后再重新push即可

  8. JAVA获取某个月(当月)第一天的开始时刻和某个月(当月)最后一天的最后时刻

    package com.date; import java.text.SimpleDateFormat; import java.util.Calendar; public class Test { ...

  9. nim_duilib之virtualListbox用法(22)

    概述 本文将介绍virtualListbox的用法. 更多请参考源码. 一个样式 样式丑了点,勿喷. 重写函数 使用virtualListbox, 需要一个派生类(继承自基类VirtualListIn ...

  10. C++基础之虚析构函数原理

    结论 虚函数表指针 + 虚函数表 共同实现 演示 VS2017(32位) 基类有析虚构函数 一段代码演示 #include <iostream> #include <memory&g ...