使用原生js读取树形结构对象构筑多级结构菜单

最近新项目的需求给我出了个难题,让我读取树形结构的对象来构筑悬浮响应式的多级菜单,因为用的是ng2框架,本来打算使用ng2-tree作为插件,可是这个插件对外开放的接口太少了,连样式接口都没有,只能用默认样式,唯有样式客户决不妥协,无奈之下只能想到用原生js的dom操作来实现。以下是代码

js部分,主要用递归方法构筑树形结构菜单:

 

 

样式部分,主要调整样式和实现鼠标悬停显示下一级菜单,样式看起来有些拙劣,凑合看吧:

 

html部分没啥好说的:

 

    完整代码,可以直接复制粘贴

    
    
      
        
        
        
        
        
        index
      
      
      
        

       

       

      你可能感兴趣的:(使用原生js读取树形结构对象构筑多级结构菜单)