jquery 遍历 json【转】
jquery 遍历 json
<HTML>
<HEAD>
<meta http-equiv="content-Type" content="text/html;charset=utf-8">
<TITLE></TITLE>
<style></style> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script type="text/javascript">
<!--json Data-->
var menulist = {
"name":"bobo",
"menulist": [
{ "MID": "M001", "MName": "首页", "Url": "#", "menulist": "" },
{ "MID": "M002", "MName": "车辆买卖", "Url": "#", "menulist":
[
{ "MID": "M003", "MName": "新车", "Url": "#", "menulist":
[
{ "MID": "M006", "MName": "奥迪", "Url": "#", "menulist": "" },
{ "MID": "M007", "MName": "别克", "Url": "#", "menulist": "" }
]
},
{ "MID": "M004", "MName": "二手车", "Url": "#", "menulist": "" },
{ "MID": "M005", "MName": "改装车", "Url": "#", "menulist": "" }
]
},
{ "MID": "M006", "MName": "宠物", "Url": "#", "menulist": "" }
]
}; <!--js Code-->
$(function () {
$("#btn_bianli").click(function () { }); var showlist = $("<ul></ul>");
showall(menulist.menulist, showlist);
$("#div_menu").append(showlist);
}); //menu_list为json数据
//parent为要组合成html的容器
function showall(menu_list, parent) {
for (var index in menu_list) {
//如果有子节点,则遍历该子节点
if (menu_list[index].menulist.length > 0) { //创建一个子节点li
var li = $("<li></li>");
var ul = $("<ul></ul>");
//将li的文本设置好,并马上添加一个空白的ul子节点,并且将这个li添加到父亲节点中
$(li).append(menu_list[index].MName).append(ul).appendTo(parent);
//将空白的ul作为下一个递归遍历的父亲节点传入
showall(menu_list[index].menulist, ul);
}
//如果该节点没有子节点,则直接将该节点li以及文本创建好直接添加到父亲节点中
else {
$("<li></li>").append(menu_list[index].MName).appendTo(parent);
}
}
} </script>
</HEAD>
<BODY>
<button id="btn_bianli">#btn_bianli</button>
<div id="div_menu" class="tree well"></div>
</BODY>
</HTML>
显示效果
完全引用自: http://blog.163.com/hks_blog/blog/static/21492609020151113344248/
jquery 遍历 json【转】的更多相关文章
- JQuery遍历json数组的3种方法
这篇文章主要介绍了JQuery遍历json数组的3种方法,本文分别给出了使用each.for遍历json的方法,其中for又分成两种形式,需要的朋友可以参考下 一.使用each遍历 $(functio ...
- 【转】 jquery遍历json数组方法
$(function () { var tbody = ""; //------------遍历对象 .each的使用------------- //对象语法JSON数据格式(当服 ...
- jquery遍历json与数组方法总结
来自:http://www.php100.com/html/program/jquery/2013/0905/5927.html 先我们来参考each() 方法,each()规定为每个匹配元素规定运行 ...
- JS/Jquery遍历JSON对象、JSON数组、JSON数组字符串、JSON对象字符串
JS遍历JSON对象 JS遍历JSON对象 <script> var obj = { "goodsid": "01001", "goods ...
- jQuery 遍历json数组的实现代码
<script type="text/javascript"> "}]; $(d1).each(function(){ alert(this.text+&qu ...
- jquery遍历json的几种方法
for循环: 1 <script> 2 var obj = { 3 "status":1, 4 "bkmsg":"\u6210\u529f ...
- jQuery遍历Json数组
var jsonArray= [{ "name": "张三", "password": "123456"},{ &qu ...
- jQuery遍历json
使用 each var anObject = {one:1,two:2,three:3}; $.each(anObject,function(name,value) { alert(name); al ...
- jQuery 遍历 json 方法大全
1.for循环: var obj = { "status":1, "bkmsg":"\u6210\u529f", "bkdata& ...
随机推荐
- node.js依赖express解析post请求四种数据格式()
分别是这四种: www-form-urlencoded, form-data, application/json, text/xml www-form-urlencoded 这是http的post请求 ...
- loadrunner分析结果二
5 worst transaction transaction name:事务名 failure ratio[%](exceeded time/transaction duration)失败率 (超标 ...
- 使用libcurl 发送post请求
SendHttpPost(string& strUrl, string& strPost, string& strResponse, int nTimeOut) { CURLc ...
- ceph API之PHP的S3-SDK包的泛域名解析问题
安装dns工具包yum -y install bind-utils 安装dns软件 yum install -y dnsmasq 配置dnsmasq的配置文件:/etc/dnsmasq.conf li ...
- ceph S3测试--cosbench
COSBench安装 Cosbench是Intel的开源云存储性能测试软件,COSBench目前已经广泛使用与云存储测试,并作为云存储的基准测试工具使用 1 环境 1.1 操作系统 COSBench可 ...
- spring boot 系列之五:spring boot 通过devtools进行热部署
前面已经分享过四篇随笔: spring boot 系列之一:spring boot 入门 spring boot 系列之二:spring boot 如何修改默认端口号和contextpath spri ...
- Java8 使用
Java8 使用 链接:https://www.jianshu.com/p/936d97ba0362 链接:https://www.jianshu.com/p/41de7b5ac7b9 本文主要总结了 ...
- CF1131D Gourmet choice(并查集,拓扑排序)
这题CF给的难度是2000,但我感觉没这么高啊…… 题目链接:CF原网 题目大意:有两个正整数序列 $a,b$,长度分别为 $n,m$.给出所有 $a_i$ 和 $b_j(1\le i\le n,1\ ...
- Looper Handler Mssage
1. 一个Handler只有一个队列;2. 在调用Handler.post(Runnable runnable)方法时,会将runnable封装成一个Message;3. 在队列执行时,会判断当前的M ...
- activity window view 关系
1.Activity , Window和View的关系是什么? 跟踪Activity的源码就会发现:Activity.attch() -> PolicyManager -> Policy ...