动态显示JSON文件内容

Question

我给出了一个包含可变数量对象的json文件，所有这些都是不同的。

这是我的JSON文件的一个例子。

{ 
"DNS": { 
      "Server": MYSERVER01 
      "IP": "XXX.XXX.XXX.XXX" 
     }, 
"TST": { 
      "SubKeyCount": 0, 
      "View": 0, 
      "Handle": { 
          "IsInvalid": false, 
          "IsClosed": false 
         }, 
      "ValueCount": 309, 
      "Name": "HKEY_LOCAL_MACHINE\\Software\\TST", 
      "ComputerName": "MYSERVER01", 
      "Hive": -2147483646, 
      "Path": "Software\\TST" 
     }, 
"ServiceNow": null, 
"InstalledSoftware": [ 
          { 
           "Status": true, 
           "Software": [ 
               "Symantec NetBackup 7.5", 
               "Symantec NetBackup Client", 

              ], 
           "Version": [ 
               "0000", 
               "7.5", 
              ] 
          }, 
          { 
           "Status": true, 
           "Software": "Symantec Endpoint Protection", 
           "Version": "12" 
          }, 
          { 
           "Status": true, 
           "Software": "System Center 2012, 
           "Version": "7.0" 
          } 
         ], 
"AutoDuplex": { 
        "Description": "NIC Auto/Auto and Duplexing", 
        "Status": true 
       }, 

"DefaultAdGroups": [ 
         { 
          "Result": true, 
          "Group": "Domain Admins" 
         }, 
         { 
          "Result": true, 
          "Group": "Test-Team" 
         }, 
         { 
          "Result": true, 
          "Group": MYSERVER01-ADMINS" 
         } 
        ] 

}

这仅仅是一个对象，可能是我的JSON文件的屈指可数。

目前我正在做一个ajax调用窗体我的jquery读取文件并发送我的jQuery作为字符串。然后我将数据解析成json格式。

对于如何使用<ul>来整齐显示这些信息，我有点困惑，因为有太多的数组深深地嵌套在文件中。

我也不确定如何动态遍历json文件中的每个对象。在开始之前，我只习惯每个文件看到1个对象。这是一个有点不同，虽然它不是那么容易，因为规定：

var jsonQC = jQuery.parseJSON(result); //result from controller 
jsonQC[1] 

Answer 1

有一些数据表的jQuery插件显示complext JSON数据。这里有一个例子：https://editor.datatables.net/examples/advanced/deepObjects.html

或者，正如这里解释你可以使用递归函数：jQuery JSON looping through nested objects

Answer 2

如何使用DL/DT/DD？

function makeDom(obj) { 
    var $dl = $("<dl/>"); 
    $.each(obj, function(name, val) { 
     $("<dt>").text(name).appendTo($dl); 
     var $dd = $("<dd>"); 
     if(val && typeof val === "object") { 
      $dd.append(makeDom(val)); 
     } else { 
      $dd.text(val); 
     } 
     $dd.appendTo($dl); 
    }); 
    return $dl; 
} 

var obj = { 
"DNS": { 
      "Server": "MYSERVER01", 
      "IP": "XXX.XXX.XXX.XXX" 
     }, 
"TST": { 
      "SubKeyCount": 0, 
      "View": 0, 
      "Handle": { 
          "IsInvalid": false, 
          "IsClosed": false 
         }, 
      "ValueCount": 309, 
      "Name": "HKEY_LOCAL_MACHINE\\Software\\TST", 
      "ComputerName": "MYSERVER01", 
      "Hive": -2147483646, 
      "Path": "Software\\TST" 
     }, 
"ServiceNow": null, 
"InstalledSoftware": [ 
          { 
           "Status": true, 
           "Software": [ 
               "Symantec NetBackup 7.5", 
               "Symantec NetBackup Client", 

              ], 
           "Version": [ 
               "0000", 
               "7.5", 
              ] 
          }, 
          { 
           "Status": true, 
           "Software": "Symantec Endpoint Protection", 
           "Version": "12" 
          }, 
          { 
           "Status": true, 
           "Software": "System Center 2012", 
           "Version": "7.0" 
          } 
         ], 
"AutoDuplex": { 
        "Description": "NIC Auto/Auto and Duplexing", 
        "Status": true 
       }, 

"DefaultAdGroups": [ 
         { 
          "Result": true, 
          "Group": "Domain Admins" 
         }, 
         { 
          "Result": true, 
          "Group": "Test-Team" 
         }, 
         { 
          "Result": true, 
          "Group": "MYSERVER01-ADMINS" 
         } 
        ] 
}; 

$(function() { 
    makeDom(obj).appendTo("body"); 
}); 

小提琴这里：http://jsfiddle.net/robbyn/0u21ewon/