任意Json转成无序列表的方法示例
更新时间:2016年12月09日 11:16:01 作者:薛彬
这篇文章主要给大家介绍了任意Json如何转成无序列表,文中给出了详细的示例代码,相信对大家的理解和学习具有一定的参考借鉴价值,有需要的朋友们下面跟着小编来一起学习学习吧。
前言
不知道大家有没有发现,在网上很多树状插件都是需要固定格式的Json,但自己在生成Json的时候没考虑这些,所以就只能自己拼接字符串来生成无序列表.
比如:
{ "顶层菜单1":[ { "domain":"顶层菜单1", "runType":"background", "moduleName":"子菜单", "memo":"描述", "srcFile":"", "depends":[] } ], "顶层菜单2":[ { "domain":"顶层菜单2", "runType":"background", "moduleName":"子菜单1", "memo":"描述", "srcFile":"", "depends":[] }, { "domain":"顶层菜单2", "runType":"background", "moduleName":"子菜单2", "memo":"描述", "srcFile":"", "depends":[] } ], "顶层菜单3":[] }
直接贴代码吧…
dataObject = JSON.parse(data); var html = '<ul>'; var domainName; var moduleName; for ( var n in dataObject) { html += '<li>' + n + '<ul class="listItem">'; for (var i = 0; i < dataObject[n].length; i++) { domainName=dataObject[n][i].domain; moduleName=dataObject[n][i].moduleName; html += '<a href="#">' + '<li>'+ moduleName + '</li>'+ '</a>'; } html += '</ul></li>'; } html += '</ul>'; $('#sidebar').append(html);
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。
您可能感兴趣的文章:
- Vue.js Ajax动态参数与列表显示实现方法
- Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
- AngularJS实现数据列表的增加、删除和上移下移等功能实例
- 将List对象列表转换成JSON格式的类实现方法
- VUEJS实战之构建基础并渲染出列表(1)
- 基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
- javascript实现列表切换效果
- JSON的String字符串与Java的List列表对象的相互转换
- jsp页面 列表 展示 ajax异步实现方法
- JS动态的把左边列表添加到右边的实现代码(可上下移动)
- 利用js来实现缩略语列表、文献来源链接和快捷键列表
相关文章
Jquery+asp.net后台数据传到前台js进行解析的方法
我们经常用jquery读取后台数据,后台返回数据。后台数据格式就有很多了,但是js里面没有什么类型之分2014-05-05浅谈JsonObject中的key-value数据解析排序问题
下面小编就为大家分享一篇浅谈JsonObject中的key-value数据解析排序问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2017-12-12JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
这篇文章主要介绍了JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码,需要的朋友可以参考下2017-09-09打印json对象的内容及JSON.stringify函数应用
json对象的内容在调试的时候用的到通过JSON.stringify函数,可以转换json对象为字符串,接下来为大家详细介绍下,感兴趣的朋友可以参考下哈2013-03-03
最新评论