var jsonData =
[{"subnetId":,"subnetNode":-,"subnetRemark":"状态自带","subnetName":"中心网络"},
{"subnetId":,"subnetNode":,"subnetRemark":"好好的","subnetName":"北京"},
{"subnetId":,"subnetNode":,"subnetRemark":"大唐电信","subnetName":"大唐电信"},
{"subnetId":,"subnetNode":,"subnetRemark":"","subnetName":"上海"},
{"subnetId":,"subnetNode":,"subnetRemark":"","subnetName":"中国联通"},
{"subnetId":,"subnetNode":,"subnetRemark":"","subnetName":"移动"},
{"subnetId":,"subnetNode":,"subnetRemark":"","subnetName":"你好"}];

有数组如上,用递归的方式实现一下效果,

subnetId与subnetNode相等时,subnetId作为父节点,subnetNode作为子节点

 function show(data,node){
var ul = "<ul>";
for(var i=;i<data.length;i++){
if(data[i]!=null){
if(data[i].subnetNode==node){
ul += "<li style='margin-left:10px;'>"+data[i].subnetName;
ul += show(data,data[i].subnetId);
ul += "</li>";
}
}
}
ul+="</ul>";
return ul;
}
var a = show(jsonData,-);
console.log(a);
var div = document.createElement(div);
div.innerHTML = a;
document.body.appendChild(div);

js递归方法创建节点的更多相关文章

  1. JS DOM创建节点

    DOM节点操作之增删改查 document.write() 可以向文档中添加节点 但是有个致命问题,会把文档原有的节点全部清空 因此不推荐使用 <!DOCTYPE html> <ht ...

  2. js添加创建节点和合并节点

    var _div = document.createElement("div"), //创建节点 txt1 = document.createTextNode("123& ...

  3. js创建节点及其属性

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. js中创建html标签、加入select下默认的option的value和text、删除select元素节点下全部的OPTION节点

    <pre name="code" class="java"> jsp 中的下拉框标签: <s:select name="sjx&qu ...

  5. js的DOM节点操作:创建 ,插入,删除,复制,查找节点

    DOM含义:DOM是文档对象模型(Document Object Model,是基于浏览器编程的一套API接口,是W3C出台的推荐标准.其赋予了JS操作节点的能力.当网页被加载时,浏览器就会创建页面的 ...

  6. JQuery_DOM 节点操作之创建节点、插入节点

    一.创建节点 为了使页面更加智能化,有时我们想动态的在html 结构页面添加一个元素标签,那么在插入之前首先要做的动作就是:创建节点 <script type="text/javasc ...

  7. js动态创建样式: style 和 link

    js动态创建样式: style 和 link ie6 不能 document.createElement('style') 然后append到head标签里.所以就找到这样个好文章 有很多提供动态创建 ...

  8. javascript创建节点的事件绑定

    javascript创建节点的事件绑定 timeupdate事件是<video>中用来返回视频播放进度的事件,绑定在<video>标签返回视频播放位置(每秒计). 现video ...

  9. 使用jQuery创建节点、将节点插入到指定的位置

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. linux命令:crontab命令(转)

    一.crond简介 二.crond服务 三.crontab命令详解 四.使用注意事项 linux系统是由 cron (crond) 这个系统服务来控制的.Linux 系统上面原本就有非常多的计划性工作 ...

  2. 关于UIView的显示问题

    今天在倒腾PP助手SDK的接入,游戏框架使用的是cocos2d-x,因为不熟悉iOS的UIKit,所以费了点功夫终于让SDK的登录页面显示出来了,问题来了,在iOS设备landscape显示模式UI显 ...

  3. qt qml 九宫格划指锁屏视图

    九宫格划指锁屏视图Lisence: MIT, 请保留本文档说明Author: surfsky.cnblogs.com 2015-02 [先看效果] [下载] http://download.csdn. ...

  4. HTML、JavaScript之单双引号转义

    一.HTML : 双引号:" 单引号:&apos; 二.JavaScript: 双引号:\" 单引号:\'

  5. java获取文件的md5值

    import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import ja ...

  6. a

    #region DataTable转Json        /// <summary>        /// 将DataTable中的数据转换为JSON字符串,只返回[{...},{... ...

  7. Ubuntu 16.04应用布署小记

    本系列文章记录了升级Ubuntu 16.04的布署过程 回到目录 10. Dokuwiki 将虚拟目录配置文件链接到Apache2的可用的配置文件库中 sudo ln -s /opt/dokuwiki ...

  8. mysql 5.7.16 远程连接

    1登录到mysql中,为root进行远程访问的授权,所以主机都可以链接 GRANT ALL PRIVILEGES ON . TO 'root'@'%'IDENTIFIED BY 'mypassword ...

  9. Prince2七大流程之项目准备

    Prince2七大流程之项目准备     今天我们正式进入七大流程的第一个流程学习,项目准备流程.决定项目是否值得做,是否值得启动.通过回答"是否有一个可交付的.值得做的项目?"这 ...

  10. 【转】T-SQL查询进阶—理解SQL Server中的锁

      简介 在SQL Server中,每一个查询都会找到最短路径实现自己的目标.如果数据库只接受一个连接一次只执行一个查询.那么查询当然是要多快好省的完成工作.但对于大多数数据库来说是需要同时处理多个查 ...