如何从我的json中输入HTML某些信息

I am having problem with my data. My JSon looks like that:

我的数据有问题。我的JSon看起来像这样:

[
    {
        "link": {
            "created_at": "2013-10-07T13:31:43+09:00",
            "id": 8,
            "items_count": 4,
            "key": "0iqVSnTU-BtJ1ItVKRe2VMWvRMU",
            "mode": "standard",
            "name": "sdasadads",
            "pusher_key": "1jtsrzl3n6i1DKA3tSZJM6LPnfQ",
            "readonly_key": "R_dD5oHMsruu0YzYVKEOA8hKKXA-r",
            "updated_at": "2013-10-08T14:06:07+09:00",
            "user_id": 2
        }
    },
    {
        "link": {
            "created_at": "2013-10-07T13:32:56+09:00",
            "id": 9,
            "items_count": 1,
            "key": "Mj-6Cc-_qaGlVTPgqKexzeijYNA",
            "mode": "standard",
            "name": "Untitled2",
            "pusher_key": "hGE0D8TSar_H_Gv9MWdpj26gamM",
            "readonly_key": "T53SNKPgyf7KvRUMzDQPaM99AAc-r",
            "updated_at": "2013-10-07T13:33:14+09:00",
            "user_id": 2
        }
    },
    {
        "link": {
            "created_at": "2013-10-11T11:18:06+09:00",
            "id": 10,
            "items_count": 0,
            "key": "X_ZoKxFPHtsvSU5W11gXx1653FU",
            "mode": "standard",
            "name": "Usdadasas",
            "pusher_key": "0PZ860awofRKB9XIrXba-xY6u14",
            "readonly_key": "2rzrRZAaR7UZRK3UbUId8xmFzd4-r",
            "updated_at": "2013-10-11T11:18:06+09:00",
            "user_id": 2
        }
    }
}

I am trying to print put all the names of the links like that:

我试图打印所有链接的名称,如:

$.post( "http://0.0.0.0:9292/api/links", function( data ) {
        document.getElementById("test").innerHTML = data[link][0].name;
      });

but it doesn't work. How can I grub all the names and put it in html?

但它不起作用。我如何grub所有的名称,并把它放在HTML?

3 个解决方案

#1

The objects are inside the array, not the other way around.

对象在数组内部,而不是相反。

link is a literal property name, not a variable containing one as a string

link是文字属性名称,而不是包含一个字符串的变量

Thus:

data[0]['link']['name']

You'll also need to make sure that the response has an application/json content type.

您还需要确保响应具有application / json内容类型。

Grabbing all the names will require you to use a loop and change the 0 each time round it.

抓取所有名称将要求您使用循环并每次更改0。

#2

First of all change last "}" to "]" (your top structure is array not object )

首先将最后一个“}”改为“]”(你的顶层结构是数组而不是对象)

Then try this

然后尝试这个

$.post( "http://0.0.0.0:9292/api/links", function( data ) {
    document.getElementById("test").innerHTML = data[0].link.name;
  });

#3

Array.prototype.map() is a good way to fetch something from data structure. With your test data in data variable, could would look like this:

Array.prototype.map()是从数据结构中获取内容的好方法。将测试数据放在数据变量中,可能如下所示:

Example here.

<div class="names"></div>

var names = data.map(function (item) {
    return item.link.name
});

document.querySelector(".names").innerHTML = names;

#1

The objects are inside the array, not the other way around.