Question

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  <title>MongoDB Display</title>
<script>
$(document).ready(function(){
    var Obj = $.getJSON("http://localhost:3000", function(){
        alert("Success");

        $(Obj.rows).each(function(index, element){
            $(#tableID).append('<tr><td>' + element[1] + '</td><td><table><tr><td>'+ Obj.rows.scripts.element[0] 
            + '</td>' + "/" + '<td>' + Obj.rows.scripts.element[1] + '</td></tr></table></td></tr>');
        })
    });
});
</script>

</head>
<body>
    <div id="wrapper">
        <h1>H 1</h1>
        <table id="tableID" border = "1">
            <th>
                <td>PAGE</td>
                <td>SCRIPTS</td>
            </th>
        </table>
    </div>
</body>
</html>

简而言之;

我已准备好在localhost：3000上显示MongoDB。服务器正在运行，我可以使用localhost:3000在浏览器上显示数据但是当我尝试在浏览器上运行上面的代码时，我只能得到js Alert("Success")和表中的硬编码部分。 PAGE和SCRIPTS ......

数据是：

{
    "offset": 0,
        "rows": [
            {
                "_id": {},
                "url": "http://www.qweq.com\r",
                "totalLines": 3084,
                "scripts": [
                    {
                        "line": 111,
                        "tag": "\"asdas/etc/designs/qwe/assets/head-5.30.31.min.js\""
                    },{
                        "line": 3065,
                        "tag": "\"asdas/etc/designs/qwe/assets/common-5.30.31.min.js\""
                    },{
                        "line": 3067,
                        "tag": "\"asda/etc/designs/qwe/assets/category-5.30.31.min.js\""
                    }
                ]
            },{
                "_id": {},
                "url": "http://www.qweqsd.com/qwdq23/qweq/qweqw/\r",
                "totalLines": 3042,
                "scripts": [
                    {
                        "line": 113,
                        "tag": "\"asda/etc/designs/asd/assets/head-5.30.31.min.js\""
                    },{
                        "line": 3023,
                        "tag": "\"asdasd/etc/designs/asd/assets/common-5.30.31.min.js\""
                    },{
                        "line": 3025,
                        "tag": "\"asdad/etc/designs/qwe/assets/category-5.30.31.min.js\""
                    }
                ]
            },

如何让这个Json数据显示在动态表中？

谢谢。

Answer 1

这个版本有点工作:)也许你会找到灵感。

$(rows).each(function(index,element){
    console.log(index); console.log(element);
    $('#tableID').append('<tr><td>' + index + '</td><td>'+ element['url'] 
                         + '</td>' + "/" + '<td>' + JSON.stringify(element['scripts']) + '</td></tr></table>');
});

http://jsfiddle.net/fw4f5L72/1/

Answer 2

看起来你在表名周围缺少引号。相反，你应该有类似$('#tableID')的东西。

此外，您还希望函数调用包含它返回给您的数据。例如：

$.getJSON("http://localhost:3000", function(data){
        alert("Success");
        console.log(data);
    });

然后，data将包含JSON对象，您可以随意操作它。

使用json数据填充动态表

2 个答案: