JQuery遞迴解析無限層級JSON物件的所有key和value
前一段時間做了一個小專案,要加一個json資料自動繫結前臺表單的功能,類似於jquery-easyui裡面的資料繫結(給它一個json物件,就能自動解析裡面有的資料。json資料的key對於表單的name屬性,也可以是id或自己定義的標籤屬性,把key對應的值賦給對應名稱的表單)。百度了許多JSON解析,都是前提知道json結構的情況下的解析,毛線的一點用都沒有,最後看了一篇部落格,明白瞭解析key和值的原理,自己寫了一個簡單的coding(裡面的json資料從網上copy過來的,哈哈),廢話不多說,上程式碼:
<!DOCTYPE html>
<head>
<title >遞迴解析無限層級JSON的所有key和value</title>
<script src="jquery-2.0.3.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div>
<ul id="menu"></ul>
</div>
<script>
var menulist = [{
"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": "" }
]
}];
$(function() {
parseJson(menulist);
});
function parseJson(jsonObj) {
if( typeof(jsonObj) == "undefined" ){
alert('JSON物件不能為空!');
}
//遍歷第一層資料
for (var topKey in jsonObj) {
//如果物件型別為object型別且陣列長度大於0,遞迴繼續解析
if (jsonObj[topKey].length > 0 && typeof(jsonObj[topKey]) == "object") {
parseJson(jsonObj[topKey]);
} else {
//如果物件型別為object型別,依次迴圈取出所有元素
if (typeof(jsonObj[topKey]) == "object") {
for(var childKey in jsonObj[topKey]) {
//如果物件型別為object型別,遞迴繼續解析
if (typeof(jsonObj[topKey][childKey]) == "object") {
parseJson(jsonObj[topKey][childKey]);
} else {
//如果物件型別為object型別,直接取元素名稱和值
$("#menu").append("<li>" + childKey + ":" + jsonObj[topKey][childKey] + "</li>");
}
}
} else{
//如果物件型別為object型別,直接取元素名稱和值
$("#menu").append("<li>" + childKey + ":" + jsonObj[topKey][childKey] + "</li>");
}
}
}
}
</script>
</body>
</html>
程式碼很簡單,只用了for迴圈、遞迴以及一些json的知識點,jquery用的熟練的很容易就能看懂(不明白的可以參考這篇部落格,地址),有什麼需要改進的或有什麼考慮不全的歡迎指出。
相關推薦
JQuery遞迴解析無限層級JSON物件的所有key和value
前一段時間做了一個小專案,要加一個json資料自動繫結前臺表單的功能,類似於jquery-easyui裡面的資料繫結(給它一個json物件,就能自動解析裡面有的資料。json資料的key對於表單的name屬性,也可以是id或自己定義的標籤屬性,把key對應的值賦
Jsoncpp未知Json獲取所有Key和Value
場景:要獲取某個Json資料,但不知道Json資料的key。如:{"item_key1":"item_value1","item_key2":"item_value2","item_key3":"item_value3"} 解決:關鍵是如何獲取到key,有了k
遞迴遍歷json裡的key和value
listJson(JSON.parseObject("jsonstr")); public void listJson(Object objJson) { if (objJson instanceof JSONArray) { JSONArray jsonArray = (
linux下 c語言遞迴遍歷資料夾下所有檔案和子資料夾(附上替換文字檔案內容的方法)
#include <stdio.h> #include <sys/dir.h> #include <string> #include <sys/stat.h> //判斷是否為資料夾 bool isDir(const cha
json物件相同key合併value值
var s = '{"身高":"175cm","性別":"男","興趣":"唱歌","興趣":"棒球","興趣":"游泳"}' var kv = {}, m, reg = /"[^"]+":"
遍歷物件的 key 和 value 值
// 遍歷物件的key值 var obj = { key1: 1, key2: 2, key3: 3 }; Object.keys(obj); // [ 'key1', 'key2', 'key3' ] // 遍歷物件的value值 var obj = { key1: 1, ke
鍵關聯資料庫資料與前臺所需無限層級json的相互遞迴轉換
測試json: 將層級json轉為資料庫儲存的平級鍵關聯資料 /** * 將層級json轉為資料庫儲存的平級鍵關聯資料 * @param {[type]} json [description] */ function JsonToSqlArr(jso
遞迴解析json物件(獲取某個key對應的value)
最近補充需求需要對json格式的資料進行處理,在網上搜尋了一些前輩們的心血,感覺不合適,就自己寫了一個, 廢話不說,直接上程式碼: package mlstudy.json; import java.io.FileInputStream; import java.io.
js遞迴遍歷樹形json結構 根據最後一個節點找到整個家族,根據父節點找到所有的子節點,根據層級關係寫成樹形結構
dataTree: [ { id: 1, address: "安徽", pid: 0 }, { id: 6, address: "安徽a", pid: 1 }, { id: 12, address: "安徽aa", pid: 6 },
js遞迴遍歷樹形json結構 根據最後一個節點找到整個家族,根據父節點找到所有的子節點,根據層級關係寫成樹形結構
dataTree: [ { id: 1, address: "安徽", pid: 0 }, { id: 6, address: "安徽a", pid: 1 }, { id: 12, address: "安徽aa", pid: 6
python遞迴解析JSON轉換為excel輸出
參考了此部落格的內容,在此基礎上在對資料進行處理: 程式碼如下: import json import pandas as pd def dict_generator(indict, pre=None): """ 把json遞迴的解析為k
JavaScript遞迴遍歷輸出json所有欄位與值的方法
宣告一個三層的json物件作為測試: var js={ "text":"MXCHIP won a prize", "id": 1234, &nbs
java:File類遞迴練習(按層級列印)
從鍵盤接收一個資料夾路徑,把資料夾中的所有檔案以及資料夾的名字按層級列印, 例如: aaa是資料夾,裡面有bbb.txt,ccc.txt,ddd.txt這些檔案,有eee這樣的資料夾,eee中有fff.txt和ggg.txt,打印出層級來 &nb
12.scrapy框架之遞迴解析和post請求
今日概要 遞迴爬取解析多頁頁面資料 scrapy核心元件工作流程 scrapy的post請求傳送 今日詳情 1.遞迴爬取解析多頁頁面資料 - 需求:將糗事百科所有頁碼的作者和段子內容資料進行爬取切持久化儲存 - 需求分析:每一個頁面對應一個url,則scrapy工程需要對每一個頁碼
java呼叫http介面並解析返回的json物件
import java.io.BufferedReader; import java.io.InputStreamReader; import java.io.OutputStreamWriter; import java.io.PrintWriter; import jav
php用遞迴實現無限極分類獲取樹形結構
表中的資料如下: 遞迴的方法: /** * 用遞迴獲取子類資訊 * $data 所有分類 * $parent_id 父級id * $level 層級 * $result 分好類的陣列 */ function getChild($data,$parent
DocumentBuilder 遞迴解析xml,適合android 以及java
package cn; import java.io.File; import javax.xml.parsers.DocumentBuilder; import javax.xml.parsers.DocumentBuilderFactory; import org.w
php遞迴實現無限級分類樹(最新版)(轉發自php中文網的大家講道理)
php遞迴實現無限級分類樹(最新版) 程式碼如下: /** * 將資料格式化成樹形結構 * @author Xuefen.Tong * @param array $items * @return array */ function gen
遞迴遍歷獲取複雜物件中所有目標屬性的值(二)
在利用遞迴遍歷獲取Java複雜物件(物件的屬性仍是物件//list/map)中指定屬性的值(一)中我寫了遞迴遍歷複雜物件中目標屬性,找到第一個目標屬性則退出遍歷。現在有遇到要遍歷複雜物件中所有目標屬性的值。且指定了屬性所在類的類名、屬性型別、屬性
DNS遞迴解析和迭代解析的區別
11.3.7 DNS遞迴解析原理 “遞迴解析”(或叫“遞迴查詢”,其實意思是一樣的)是最常見,也是預設的解析方式。在這種解析方式中,如果客戶端配置的本地名稱伺服器不能解析的話,則後面的查詢全由本地名稱伺服器代替DNS客戶端進行查詢,直到本地名稱伺服器從權威名