Question

我的代码工作正常但我无法打印我从JSON值制作的表。有什么建议??

var resData = {"key1":"value","key2":"value"};

var table = $('<html/>').append('<thead><tr><th>Filter</th><th>Values</th></tr></thead>').appendTo('body'),
    tbody = table.append('<tbody/>');
$.each(resData, function(key, value){
    tbody.append('<tr><td>'+key+'</td><td>'+value+'</td></tr>');
});
console.log(table);

Answer 1

首先在var table中创建完整的表格html，然后将表格附加到正文

Answer 2

你可以这样做。

＆＃13;

var resData = {"key1":"value","key2":"value"};

var table_str = '<table><thead><tr><th>Filter</th><th>Values</th></tr></thead>';
    table_str += '<tbody>';
$.each(resData, function(key, value){
    table_str +='<tr><td>'+key+'</td><td>'+value+'</td></tr>';
});
$("#content").html(table_str);
console.log(table_str);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content">
</div>

＆＃13;

Answer 3

你可以添加一个varible并用值连接它，然后附加到html

var resData = {"key1":"value","key2":"value"};

var table='<table><thead><tr><th>Filter</th><th>Values</th></tr></thead><tbody><tbody/>';
$.each(resData, function(key, value){
    table+='<tr><td>'+key+'</td><td>'+value+'</td></tr>';
});
table+='</table>';
$('<html/>').append(table);
console.log(table);

Answer 4

您将jQuery对象直接打印到控制台。我认为你需要表格的html内容。您需要使用console.log(table.html())。请参阅html() docs

Answer 5

在JavaScript中试用：

var resData = {"key1":"value","key2":"value"};

var table = '<table><thead><tr><th>Filter</th><th>Values</th></tr></thead>';
table += '<tbody>';
for (var i in resData) {
    table += '<tr><td>'+i+'</td><td>'+resData[i]+'</td></tr>';
}
document.getElementById("table").innerHTML = table;

table,th,td { border: 1px solid black; }

<div id="table">
</div>

如何打印由JSON数据制作的表格？

5 个答案: