在动态表javascript中显示对象数组

Question

我想使用javascript在动态表中显示一个对象数组.

var rows=[{ name : "John", age:20, email: "xx@hotmail.com"},
    { name : "Jack", age:50, email: "xxx@hotmail.com"},
    { name : "Son", age:45, email: "xxxx@hotmail.com"}
........................etc
   ];

这就是它的外观.我想知道如何将其显示为动态表.

Answer 1

这是你如何做到的:

Javascript解决方案:

FIDDLE:

var rows = [{
    name: "John",
    age: 20,
    email: "xx@hotmail.com"
}, {
    name: "Jack",
    age: 50,
    email: "xxx@hotmail.com"
}, {
    name: "Son",
    age: 45,
    email: "xxxx@hotmail.com"
}];

var html = "<table border='1|1'>";
for (var i = 0; i < rows.length; i++) {
    html+="<tr>";
    html+="<td>"+rows[i].name+"</td>";
    html+="<td>"+rows[i].age+"</td>";
    html+="<td>"+rows[i].email+"</td>";

    html+="</tr>";

}
html+="</table>";
document.getElementById("box").innerHTML = html;

jQuery解决方案:

小提琴

var rows = [{
        name: "John",
        age: 20,
        email: "xx@hotmail.com"
    }, {
        name: "Jack",
        age: 50,
        email: "xxx@hotmail.com"
    }, {
        name: "Son",
        age: 45,
        email: "xxxx@hotmail.com"
    }];

$(document).ready(function () {
    var html = "<table border='1|1'>";
    for (var i = 0; i < rows.length; i++) {
        html+="<tr>";
        html+="<td>"+rows[i].name+"</td>";
        html+="<td>"+rows[i].age+"</td>";
        html+="<td>"+rows[i].email+"</td>";

        html+="</tr>";

    }
    html+="</table>";
    $("div").html(html);
});