使用 jQuery 循环遍历 JSON 数据

Question

我正在尝试从 JSON 文件（Squarespace）中获取特定信息，目的是将其附加到 <div>。我需要遍历数据并从每个帖子中获取位置。这是我正在使用的代码：

$.getJSON("http://www.theluxedit.com/?format=json-pretty", function(data) {
    $.each(data, function(index, value) {
        $('.locationData').append(data.items.location.addressLine2);
    });
});

只有当我使用整数指定项目时它才会起作用，例如：

$('.locationData').append(data.items[1].location.addressLine2);

这似乎适用于我尝试过的其他示例，是不是我的 JSON 连接有误？

Answer 1

问题是您需要遍历项目本身而不是返回的整个对象：

var $locationData = $('.locationData');
$.getJSON("http://www.theluxedit.com/?format=json-pretty", function(data) {
    $.each(data.items, function(index, item) {
        $locationData.append(getLocationEl(item.location.addressLine2));    
    });
});

function getLocationEl(address) {
    return $('<div>', { text: address });
}

通过这样做，每次迭代都会查看不同的项目。然后，您可以直接访问该项目的属性，而不是从返回的顶级数据中访问。

另外，我假设这是在 theluxedit.com 上运行的。否则你会得到一个错误。有关更多信息，请参阅此内容："No 'Access-Control-Allow-Origin' header is present on the requested resource"