使用 JSON 数据创建表的 jQuery 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7803171/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery function to create table using JSON data
提问by Vonti
How do you retrieve a JSON object from a local file and display it in a table using jQuery? Here is the content of JSON file (jsondata.json):
如何从本地文件中检索 JSON 对象并使用 jQuery 将其显示在表中？这是 JSON 文件 ( jsondata.json)的内容：
{
"scores" : [ ["3/1/2011", 610],["4/1/2011", 610],["5/1/2011", 610],["6/1/2011", 610], ["7/1/2011", 720], ["8/1/2011", 500], ["9/1/2011", 500] ]
}
回答by Jayendra
Example - Demo http://jsfiddle.net/kVdZG/
示例 - 演示http://jsfiddle.net/kVdZG/
You can iterate and append the elements.
您可以迭代和附加元素。
<table id='scores' border="1"></table>
JS -
JS -
var data = { "scores" : [ ["3/1/2011", 610],["4/1/2011", 610],["5/1/2011", 610],["6/1/2011", 610], ["7/1/2011", 720], ["8/1/2011", 500], ["9/1/2011", 500] ] }
$(data.scores).each(function(index, element){
$('#scores').append('<tr><td> '+element[0]+' </td> <td> '+element[1]+' </td></tr>');
})
回答by Gajus
jQuery does not provide any function to format JSON as a HTML table. jQuery provides only the functionality required to itterate the JSON object and manipulate the DOM. However, there are jQuery plugins that can do that.
jQuery 不提供任何将 JSON 格式化为 HTML 表格的函数。jQuery 仅提供迭代 JSON 对象和操作 DOM 所需的功能。但是，有 jQuery 插件可以做到这一点。
回答by Sedat Ba?ar
var json = { "scores" : [ ["3/1/2011", 610],["4/1/2011", 610],["5/1/2011", 610],["6/1/2011", 610], ["7/1/2011", 720], ["8/1/2011", 500], ["9/1/2011", 500] ] }
$.each(json.scores,function(key,value){
alert(key + " "+value)
})
u can check from here http://jsfiddle.net/atMa7/
你可以从这里查看http://jsfiddle.net/atMa7/
