Question

我是java脚本的新手，并且使用java脚本，我必须根据通过AJAX接收的JSON响应在同一页面中添加多个div。直到现在我已经解析了JSON（它具有嵌套的键值对）并尝试使用它在div中追加多个div。那么我应该如何实现呢。包括这个我需要内部的值必须对应于它的外部。

解析的JSON响应是

{
"a_id": 1993547955,
"allUserData": [
    {
        "id": "1",
        "aid": "1993547955",
        "uid": "8248008822309593525",
        "Handle": "russiaprez1",
        "email": "SJ@yeltsin.com",
        "name": "Boris Yeltsin",
        "Joined": "2014-04-19 12:11:25",
        "Initialreferrer": "",
        "Location": "{\"ip\":\"117.205.113.119\",\"country_code\":\"IN\",\"country_name\":\"India\",\"region_code\":\"36\",\"region_name\":\"Uttar Pradesh\",\"city\":\"Jhansi\",\"zipcode\":\"\",\"latitude\":25.4333,\"longitude\":78.5833,\"metro_code\":\"\",\"area_code\":\"\"}\n",
        "Browser": "Google Chrome",
        "Platform": "Linux",
        "createDate": "2014-04-19 12:11:25",
        "ModifyDate": "2014-04-19 12:11:25",
        "eventData": {
            "3712696604206078547": [
                {
                    "event_name0": "view",
                    "event_data0": "{\"aid\":\"1993547955\",\"uid\":\"8248008822309593525\",\"sid\":\"8604796462020534567\",\"vid\":\"3712696604206078547\",\"unix\":\"1397889659\",\"milliseconds\":\"1397889659118\",\"title\":\"\",\"documentUrl\":\"http://dailydeal.in/\",\"windowUrl\":\"http://dailydeal.in/\",\"host\":\"dailydeal.in\",\"referrer\":\"\",\"domain\":\"dailydeal.in\",\"href\":\"http://dailydeal.in/\",\"path\":\"/\",\"screenAH\":\"744\",\"screenAW\":\"1307\",\"screenCD\":\"24\",\"screenHeight\":\"768\",\"screenPD\":\"24\"}",
                    "time": "2014-04-19 12:11:25"
                },
                "2931262172295540157": [
                {
                    "event_name0": "view",
                    "event_data0": "{\"aid\":\"1993547955\",\"uid\":\"8248008822309593525\",\"sid\":\"8604796462020534567\",\"vid\":\"2931262172295540157\",\"unix\":\"1397889664\",\"milliseconds\":\"1397889664295\",\"title\":\"\",\"documentUrl\":\"http://dailydeal.in/\",\"windowUrl\":\"http://dailydeal.in/\",\"host\":\"dailydeal.in\",\"referrer\":\"\",\"domain\":\"dailydeal.in\",\"href\":\"http://dailydeal.in/\",\"path\":\"/\",\"screenAH\":\"744\",\"screenAW\":\"1307\",\"screenCD\":\"24\",\"screenHeight\":\"768\",\"screenPD\":\"24\"}",
                    "time": "2014-04-19 12:11:26"
                }

            ]
        }
    }
]
}

javascript代码

xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        var recievedResponse = xmlhttp.responseText;
        alert("response recieved");
        var response  = JSON.parse(recievedResponse);
        //alert(response.allUserData[0].Location);
        var userData = response.allUserData;
        //var loc = JSON.parse(response.allUserData[0].Location);
        //alert(loc.ip);
        for(var details in userData){
            //alert(userData[details].uid);
            var loc = JSON.parse(userData[details].Location);
            //alert(Loc.ip);
            var events = userData[details].eventData;
            document.getElementById("showData").innerHTML+="<table class='table table-bordered'><thead><tr><th><div><div style='float:left'>User "+ userData[details].uid + "</div><div style='float:right'>"+ userData[details].ModifyDate + "</div></div></th>    <th colspan='3'><a class='row_events' href='#'> Show raw events</a></th></tr></thead><tbody style='background: white;'><tr><td style='width: 30%;'><div class='sidebar-inner'><p><strong>Joined:</strong>"+ userData[details].createDate + "</p><p> <strong>Initial referrer:</strong> <a class='referrer_link' href='"+ userData[details].Initialreferrer + "' target='_blank' title="+ userData[details].Initialreferrer +">"+ userData[details].Initialreferrer +"</a></p><p><strong>Location:</strong>"+ loc.city +", "+ loc.region_name +", "+ loc.country_name +"</p><p><strong>Browser:</strong>"+ userData[details].Browser + "</p><p><strong>Platform:</strong>"+ userData[details].Platform + "</p></div></td>"+
            "<td><div class='eventsBody'>"+
            for (var ev in events){      <----------------where i am stuck, and getting error.
                var value  = events[ev];
                console.log(value);
            }
            +"</div></td></tr></tbody></table>";
        }
    }

错误是： -

Uncaught SyntaxError: Unexpected token for

Answer 1

我认为您的代码存在轻微错误，您正在使用＆＃34; ev＆＃34;而不是＆＃34;事件＆＃34;。

for (var ev in events){      
  var value  = events[ev];
  console.log(value);
}

Answer 2

附加内部div的示例：在这里，我给父div和子div添加了唯一的id，以附加到父div

JS代码：

for(var details in userData){      
      var loc = JSON.parse(userData[details].Location);
      var events = userData[details].eventData;
      document.getElementById("showData").innerHTML+="<table class='table table-bordered'>   <tr><td><div id='eventsBody_'"+details+"></div></td></tr></tbody></table>";
        for (var ev in events){     
           document.getElementById("eventsBody_"+details).innerHTML += "appedn child div"
        }

    }

如何在字符串中的Javascript中解析JSON中的嵌套键值对

2 个答案: