迭代JSON以创建innerHTML链接

Question

好吧我现在已经在Stack Overflow上搜索了一段时间，但似乎无法找到问题的解决方案。我尝试遍历JSON以获取每个ids部分中的所有dates和top_worst。 JSON看起来像这样：

[
{
    "timerName": "FT:Tree",
    "top_worst": [
        {
            "id": 44083,
            "date": "2015-07-14T21:31:58+00:00"
        },
        {
            "id": 44059,
            "date": "2015-07-14T20:00:58+00:00"
        },
        {
            "id": 44119,
            "date": "2015-07-14T23:30:31+00:00"
        },
        {
            "id": 44065,
            "date": "2015-07-14T20:20:46+00:00"
        },
        {
            "id": 43981,
            "date": "2015-07-14T15:20:50+00:00"
        }
    ],
    "daily_percentile_90th": 26651,
    "daily_average": 22076
},
{
    "timerName": "Search:Blog",
    "top_worst": [
        {
            "id": 44087,
            "date": "2015-07-14T21:28:48+00:00"
        },
        {
            "id": 44087,
            "date": "2015-07-14T21:22:54+00:00"
        }
    ],
    "daily_percentile_90th": 9248.1,
    "daily_average": 9040.5
},
{
    "timerName": "Search:ViewImage",
    "top_worst": [
        {
            "id": 44152,
            "date": "2015-07-15T01:04:53+00:00"
        },
        {
            "id": 44092,
            "date": "2015-07-14T21:41:27+00:00"
        },
        {
            "id": 44230,
            "date": "2015-07-15T05:22:44+00:00"
        },
        {
            "id": 44074,
            "date": "2015-07-14T20:40:57+00:00"
        },
        {
            "id": 44098,
            "date": "2015-07-14T22:03:25+00:00"
        }
    ],
    "daily_percentile_90th": 6545.6,
    "daily_average": 5571.49
}
]

所以问题是我的for循环导致问题，因为并非所有的定时器都有top_worst部分，所以当我尝试在for循环中使用.length时会抛出错误。目标是使用id作为链接的一部分在表格单元格内获取链接，然后使用日期作为可见部分。如果你感到困惑，请看下面的图片（别担心，我也很清楚）。这是我的HTML代码，因此您可以查看正在进行的操作：

function createTable(jsonData){
$.each(jsonData, function(i, item){

    var daily90th = (item.daily_percentile_90th/1000).toFixed(2);
    var dailyAverage = (item.daily_average/1000).toFixed(2);

    var $tr = $("<tr class='clickable'>").append(
        $("<td align='left'>").text(item.timerName),
        $("<td class='daily90'>").text(daily90th),
        $("<td class='dailyAvg'>").text(dailyAverage)).appendTo("#reportTable");

    var $ta = $("<tr id='spaces"+(i)+"'>").append(
        $("<td id='createLinks"+(i)+"'>")).appendTo("#reportTable");


        var where = document.getElementById('createLinks'+(i));
        where.innerHTML = "<a href='http:/example.com/example.html?id=44217'>2015-07-15T04:43:49+00:00</a>";            

});
} 

任何有关这方面的帮助都会很棒!!!这也是一个小提琴：http://jsfiddle.net/rg2s7Lqk/1/

这就是我网站上的样子，但我需要动态创建它们而不是一个静态链接。

感谢你!!!!

Answer 1

普通for循环有什么问题？

var where = $('#createLinks'+(i));
for (var i in item.top_worst) {
    var bad = item.top_worst[i];
    console.log(bad);
    where.append("<a href='http://example.com/example.html?id=44217'>"+bad.date+"</a><br/>");
}

Working demo.