快捷導(dǎo)航

任意Json轉(zhuǎn)成無序列表的方法示例

更新時間：2016年12月09日 11:16:01 作者：薛彬

這篇文章主要給大家介紹了任意Json如何轉(zhuǎn)成無序列表，文中給出了詳細(xì)的示例代碼，相信對大家的理解和學(xué)習(xí)具有一定的參考借鑒價值，有需要的朋友們下面跟著小編來一起學(xué)習(xí)學(xué)習(xí)吧。

前言

不知道大家有沒有發(fā)現(xiàn)，在網(wǎng)上很多樹狀插件都是需要固定格式的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);

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流。

您可能感興趣的文章:

相關(guān)文章

理解JSON：3分鐘課程
如果你跟我一樣(我擔(dān)心你就是)，那么，到目前為止，這應(yīng)該是你對JSON的經(jīng)驗
2011-10-10
簡明json介紹
不要認(rèn)為JSON是種新的應(yīng)用，其實JSON就是javascript支持的一種對象直接量。
2008-09-09
IE8 原生JSON支持
你可能已經(jīng)從這篇文章的標(biāo)題中猜到了，Internet Explorer 8（目前是Beta2）提供了原生JSON的解析和序列化。
2009-04-04
javascript JSON操作入門實例
JSON （JavaScript Object Notation）一種簡單的數(shù)據(jù)格式，比xml更輕巧。 JSON 是 JavaScript 原生格式，這意味著在 JavaScript 中處理 JSON 數(shù)據(jù)不需要任何特殊的 API 或工具包。
2010-04-04
詳解Java中String JSONObject JSONArray List<實體類>轉(zhuǎn)換
這篇文章主要介紹了詳解String JSONObject JSONArray List<實體類>轉(zhuǎn)換，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-11-11
JSON 數(shù)據(jù)格式詳解
JSON(JavaScript Object Notation) 是一種輕量級的數(shù)據(jù)交換格式。JSON采用完全獨立于語言的文本格式，這些特性使JSON成為理想的數(shù)據(jù)交換語言。易于人閱讀和編寫，同時也易于機器解析和生成
2017-09-09
JSON 客戶端和服務(wù)器端的格式轉(zhuǎn)換
JSON是JavaScript Object Notation的縮寫。JSON是個輕量級的用于服務(wù)器端和客戶端交換數(shù)據(jù)的數(shù)據(jù)格式。它經(jīng)常會用在ajax應(yīng)用上,是因為它是基于ajax對象的格式定義出來的。
2009-08-08
js+json用表格實現(xiàn)簡單網(wǎng)站左側(cè)導(dǎo)航
閑暇之余，制作一用表格實現(xiàn)的簡單的網(wǎng)站導(dǎo)航條，分享給大家。這里的數(shù)據(jù)基于json格式，學(xué)習(xí)json的朋友可以參考下。
2010-04-04
10分鐘學(xué)會js處理json的常用方法
這篇文章主要介紹了10分鐘學(xué)會js處理json的常用方法,需要的朋友可以參考下
2020-12-12
JSON.parse()方法轉(zhuǎn)換對象的示例以及注意事項
這篇文章主要介紹了JSON.parse()方法轉(zhuǎn)換對象的示例以及注意事項,我們可以使用 JSON.parse() 方法將數(shù)據(jù)轉(zhuǎn)換為 JavaScript 對象,需要的朋友可以參考下
2023-05-05