Javascript 从json数据创建表
我有一些JSON数据,我想从中创建一个表,但是我从控制台得到了这个错误:Javascript 从json数据创建表,javascript,json,Javascript,Json,我有一些JSON数据,我想从中创建一个表,但是我从控制台得到了这个错误:TypeError:obj.labels[I].getAttribute不是一个函数。 创建表头是可以的,我只有在尝试用数据填充表时才会出现错误 我希望汽车表有标题[id,carname,year,registration] 错误来自此行:span.innerText=obj.labels[i].getAttribute(attrs[j]) 我不知道为什么会出错,我需要一些帮助来提取汽车数据并填充表格 var attrs=
TypeError:obj.labels[I].getAttribute不是一个函数
。
创建表头是可以的,我只有在尝试用数据填充表时才会出现错误
我希望汽车表有标题[id,carname,year,registration]
错误来自此行:span.innerText=obj.labels[i].getAttribute(attrs[j])代码>
我不知道为什么会出错,我需要一些帮助来提取汽车数据并填充表格
var attrs=[“id”、“name”、“year”、“registration”];
var jsonString=
“{\n”+
““标签”:[\n”+
“{\n”+
““名称”:“测试”,\n”+
““年龄”:33岁,\n”+
““联系人”:测试,\n”+
““汽车”:[\n”+
“{“id”:2222,“卡纳姆”:“福特”,“年份”:2000,“注册”:cd60}\n”+
“{“id”:3333,“卡纳姆”:“宝马”,“年份”:2012,“注册”:fs41}\n”+
“]\n”+
“}\n”+
“]\n”+
“}\n”+
'';
var obj=JSON.parse(jsonString);
//创建表
var myTableDiv=document.getElementById(“mytable”)
var table=document.createElement('table');
var tableBody=document.createElement('tbody');
table.appendChild(表体);
//标题
对于(变量i=0;i myTableDiv.appendChild(table)
如果我正确理解您的问题,您希望在HTML表格中显示汽车详细信息。您的输入JSON数据结构如下所示:
标签
有一组对象(假设每个对象都是标签
)
- 每个标签都有属性和一组
汽车
- 每辆车都有属性
要访问汽车详细信息,您的代码如下:
var attrs = ["id", "carname", "year", "registration"];
var jsonString =
'{\n' +
' "labels": [\n' +
' {\n' +
' "name": "test",\n' +
' "age": 33,\n' +
' "contact": "test",\n' +
' "cars": [\n' +
' {"id": 2222, "carname": "ford", "year": 2000, "registration": "cd60"},\n' +
' {"id": 3333, "carname": "BMW", "year": 2012, "registration": "fs41"}\n' +
' ]\n' +
' }\n' +
' ]\n' +
'}\n' +
'';
var obj = JSON.parse(jsonString);
console.log(obj)
for (var i = 0; i < obj.labels.length; i++) {
for (var j = 0; j < obj.labels[i]['cars'].length; j++) {
for (var k = 0; k < attrs.length; k++) {
console.log(obj.labels[0]['cars'][j][attrs[k]])
}
console.log("=========")
}
}
如果要读取所有汽车属性:
[...obj.labels].forEach(element => {
element['cars'].forEach(car => {
for (var i = 0; i < attrs.length; i++) {
console.log(car[attrs[i]]);
}
});
});
[...obj.labels].forEach(element => {
element['cars'].forEach(car => Object.keys(car).map(attr =>
console.log(attr + " " + car[attr])));
});
你忘了问问题。我需要一些帮助来提取汽车数据并填充表。是否以这种方式访问属性值:labels[I][attrs[j]你需要问问题。你到底被困在哪里?