清单JSON

Question

我试图列出从使用jQuery $ .getJSON

这里文件我的JSON数组的数组上市对象里面是我现在：

(document).ready(function() { 
    var theAPI = "test.js"; 

    $("button").click(function() { 
     $.getJSON(theAPI, function(result) { 
      $.each(result, function(i, field) { 
       $("div").append(i + " - - - " + field + "<br/>"); 
      }); 
     }); 
    }); 
}); 

和我输出是：

样 - - - mykind

的nextPageToken - - - CAUQAA

pageI nfo - [ - 对象对象]

如何附加这个[object Object]？ 这里是test.js：

{ 
"kind": "mykind", 
"nextPageToken": "CAUQAA", 

"pageInfo": { 

    "totalResults": 1691, 
    "resultsPerPage": 5 
} 

} 

UPDATE JSON.stringify（）是不是一个答案，我想列出每一个JSON对象。

Answer 1

我认为一个通用的解决方案，这将是伟大的，因为在将来某个时候你的JSON结构可能会发生变化，变得更加复杂。

因此，我试图想出了一个通用的解决方案here

var result = { 
    "key-1": "value-1", 
    "key-2": "value-2", 
    "key-3": { 
     "key-31": "value-31", 
     "key-32": "value-32", 
     "key-33": ["value-331", "value-332", "value-333"], 
     "key-34": { 
      "key-341": 341, 
      "key-342": 342, 
      "key-343": [3431], 
      "key-344": true, 
      "key-345": false, 
      "key-346": { 
       "key-3461": [3461, "value-3462", true, false] 
      } 
     } 
    }, 
    "key-4": "value-4", 
    "key-5": ["value-51", "value-52"], 
    "key-6": { 
     "key-61": "value-61", 
     "key-62": ["value-621", "value-622"], 
     "key-63": { 
      "key-631": "value-631", 
      "key-632": true, 
      "key-633": false 
     } 
    }, 
    "key-7": function() { 
     console.log("I am a function..."); 
    } 
}; 

var tabCount = 0, 
    typeMap = { 
     "STRING": "[object String]", 
     "NUMBER": "[object Number]", 
     "BOOLEAN": "[object Boolean]", 
     "ARRAY": "[object Array]", 
     "OBJECT": "[object Object]", 
     "FUNCTION": "[object Function]" 
    }, 
    getTypeOfObject = function(o) { 
     return Object.prototype.toString.call(o); 
    }, 
    getTabSpacing = function(numberOfTabs) { 
     var tab = "    ", 
      result = ""; 
     for(var index = 0; index < numberOfTabs; index++) { 
      result += tab; 
     } 
     return result; 
    }, 
    iterator = function(obj, tab) { 
     $.each(obj, function(key, value) { 
      if(getTypeOfObject(value) === typeMap.OBJECT) { 
       $("div").append(getTabSpacing(tab) + key + ":<br/>"); 
       iterator(value, ++tabCount); 
       --tabCount; 
      } 
      else { 
       $("div").append(getTabSpacing(tab) + key + ": " + value + "<br/>"); 
      } 
     });  
    }; 

iterator(result, tabCount); 

我不知道如果这是你要找的人。

Answer 2

可以字符串化像这样（这里是jsfiddle）：

$(document).ready(function(){ 
var theAPI = "test.js"; 
$("button").click(function(){ 
    $.getJSON(theAPI, function(result){ 
     $.each(result, function(i, field){ 
      $("div").append(i+ " - - - " +JSON.stringify(field)+ "<br/>"); 
     }); 
    }); 
}); 
}); 

Answer 3

用户JSON.stringify（）

$("button").click(function(){ 
    $.getJSON(theAPI, function(result){ 
     $.each(result, function(i, field){ 
      $("div").append(i+ " - - - " +JSON.stringify(field) + "<br/>"); 
     }); 
    }); 
}); 

Answer 4

如果有嵌套，你可以做

的只有一个级别

$("button").click(function(){ 
    $.getJSON(theAPI, function(result){ 
    $.each(result, function(key, value){ 
     if (key=="pageInfo") { // or typeof value=="object" 
     $.each(value, function(pKey, pValue){ 
      $("div").append(pKey+ " - - - " +pValue + "<br/>"); 
     }); 
     } 
     else { 
      $("div").append(key+ " - - - " +value + "<br/>"); 
     } 
    }); 

    }); 
}); 

否则您将需要求助

例子：

var result = { 
 

 
    "kind": "mykind", 
 

 
    "lineInfo": { 
 
    "totalLineResults": 691, 
 
    "resultsPerLine": 9 
 
    }, 
 

 
    "nextPageToken": "CAUQAA", 
 

 
    "pageInfo": { 
 
    "totalResults": 1691, 
 
    "resultsPerPage": 5 
 
    } 
 
} 
 

 
$.each(result, function(key, value) { 
 
    if (typeof value=="object") { 
 
    $("div").append(key + "<ul>"); 
 
    $.each(value, function(pKey, pValue) { 
 
     $("div").append("<li>"+pKey + " - - - " + pValue + "</li>"); 
 
    }); 
 
    $("div").append("</ul>"); 
 
    } else { 
 
    $("div").append(key + " - - - " + value + "<br/>"); 
 
    } 
 
});

ul { display:inline }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div></div>