Question

如果我这样做，我会在firebug中收到所有正确的数据

 $.getJSON("https://www.googleapis.com/customsearch/v1?key=AIzaSyDPuIrijE0IQ6330vMLN2p-L_4J6y_G60c&cx=013036536707430787589:_pqjad5hr1a&q=cars&alt=json&callback=?",
               {

               },
               function (recievedData) {
                   console.log(recievedData);
});

数据的结构是这样的（它真的很长，所以我把它放在一个小提琴中）

http://jsfiddle.net/tsDrv/

如果您想完整查看，请将其放入浏览器中： https://www.googleapis.com/customsearch/v1?key=AIzaSyDPuIrijE0IQ6330vMLN2p-L_4J6y_G60c&cx=013036536707430787589:_pqjad5hr1a&q=cars&alt=json

我想做的就是破解“项目”并将它们包装在

中以显示在页面上，所以我试试这个：

$.getJSON("https://www.googleapis.com/customsearch/v1?key=AIzaSyDPuIrijE0IQ6330vMLN2p-L_4J6y_G60c&cx=013036536707430787589:_pqjad5hr1a&q=cars&alt=json&callback=?",
               {

               },
               function (recievedData) {
                   $.each(recievedData, function (i, item) {
                       $('#theBody').append(
                           $(document.createElement('li')).text(item.items)
                       );
                   });
               });

Firebug没有读取错误，但没有显示任何内容，我确实以另一种方式尝试并继续获取[object Object]如何深入访问JSON数组以在页面上显示？

Answer 1

以下是代码。目前，我已使用item.snippet阅读了代码段，同样您可以阅读item.title，item.displayLink，item.formattedUrl等。

$.getJSON("https://www.googleapis.com/customsearch/v1?key=AIzaSyDPuIrijE0IQ6330vMLN2p-L_4J6y_G60c&cx=013036536707430787589:_pqjad5hr1a&q=cars&alt=json&callback=?",
               function (recievedData) {
                //console.log(recievedData);
                   $.each(recievedData.items, function (i, item) {
                       $('#theBody').append(
                           $(document.createElement('li')).text(item.snippet)
                       );
                   });
               });

<强> DEMO

Answer 2

由于你想附加li元素，你应该将它包装成ul元素。由于您的json具有深层结构，因此您应该实现一个递归元素构建器函数，该函数调用自身直到满足叶子。

如果你的目标是最终显示没有样式的JSON内容，你应该有一个pre元素并将其文本设置为JSON.stringify(yourJsonObject, null, "\t")。

在HTML中包装JSON元素

2 个答案: