pCloud Partner Program

好用JSON Editor

程式技術/Javascript 2011/12/30 12:22
views: 109134 times
在開發網頁程式, 用到解析和產生 JSON 是經常發生的事, 不過如何快速的解析或是產生 JSON , 又或是用來除錯這些 JSON 的資料, 不像 XML 可以利用瀏覽器來幫忙, JSON 可以利用這個作者 Thomas - http://www.thomasfrank.se/about.html 開發的工具來進行 JSON 的線上測試.

說明在這裡: http://www.thomasfrank.se/json_editor.html
他有線上使用版, 和下載版, 若是進行除錯, 可以直接使用線上版: http://www.thomasfrank.se/downloadableJS/JSONeditor_example.html

以之前文章 http://diary.tw/tim/22 的資料為例:

{ 'obj1': {
  'child1':'value1',
  'child2':'value2'
  },
  'array1': [1, 2, 3, 4, 5]
};

將內容貼到 JSON Editor 裡, 按下 save 鍵, 就會產生出該 JSON 的樹狀結構在該 editor 左側(記得要自己按下 + 號展開, 如下圖:
用戶插入圖片
這樣可以很容易的理解及看出該 JSON 資料的內容. 若是要取得某一節點, 可以點在該節點上, 並看 editor 上的 label及下面的 value 就可以利用程式取出該 JSON 資料結構的資料點, 以上面的 array1 中的 1 為例, 圖示如下:
用戶插入圖片

這樣是不是十分方便, 對於在使用 JSON 的開發上, 有十足的加速作用呢!


top

Trackback Address :: http://diary.tw/tim/trackback/976

Write a comment


PREV : [1] : ... [206] : [207] : [208] : [209] : [210] : [211] : [212] : [213] : [214] : ... [509] : NEXT



AGI 亞奇雷 240GB 2.5吋 SATA3 SSD 固態硬碟
TEAM十銓 L5 Lite 3D 1TB 2.5吋 SSD固態硬碟
統一 番茄汁(6入/組)
UNITEK TYPE-C 轉VGA/HDMI/PD充電/HUB 鋁合金多功能轉接器
亞果元素 CASA Hub VH1 Type-C 轉 VGA - HDMI二合一顯示轉接器


 Waiting...