将 HTML 表格转换为 Json 文件
[英]Convert HTML Table to Json file
问题描述
Is it possible to convert a HTML table to json like this:
是否可以像这样将 HTML 表转换为 json：
Name Gender Age姓名 性别 年龄
John M 18约翰 M 18
Mike M 19迈克 M 19
Json:杰森：
{"Values" : {
"1" : {
"name": "John",
"Gender": "M",
"Age": "18"
},
"2": {
"name": "Mike",
"Gender": "M",
"Age": "19"
},
}}
I already have this code:我已经有了这个代码：
(function() {
var jsonArr = [];
var obj = {};
var thNum = document.getElementsByTagName('th').length;
var arrLength = document.getElementsByTagName('td').length;
for(i = 0; i<arrLength;i++){
if(i%thNum==0){
obj = {};
}
var head = document.getElementsByTagName('th')[i%thNum].innerHTML;
var content = document.getElementsByTagName('td')[i].innerHTML;
obj[head] = content;
if(i%thNum==0){
jsonArr.push(obj);
}
}
document.write("<br>"+JSON.stringify(jsonArr));
})();
The script convert this:脚本将其转换为：
<!DOCTYPE html>
<TABLE border="3" rules="all" bgcolor="#E7E7E7" cellpadding="1" cellspacing="1">
<TR>
<TH align=center><font size="3" face="Arial">Date</font></TH>
<TH align=center><font size="3" face="Arial"><B>Teacher</B></font></TH>
<TH align=center><font size="3" face="Arial">?</font></TH>
<TH align=center><font size="3" face="Arial">Hour</font></TH>
<TH align=center><font size="3" face="Arial">Subject</font></TH>
<TH align=center><font size="3" face="Arial">Class</font></TH>
<TH align=center><font size="3" face="Arial">Room</font></TH>
<TH align=center><font size="3" face="Arial">(Teacher)</font></TH>
<TH align=center><font size="3" face="Arial">(Room)</font></TH>
<TH align=center><font size="3" face="Arial">XYY</font></TH>
<TH align=center><font size="3" face="Arial"><B>Information</B></font></TH>
<TH align=center><font size="3" face="Arial">(Le.) nach</font></TH>
</TR>
<TR><TD align=center><font size="3" face="Arial">24.9.</font></TD>
<TD align=center><font size="3" face="Arial"><B><strike>Dohe</strike></B></font></TD>
<TD align=center><font size="3" face="Arial">Free</font></TD>
<TD align=center><font size="3" face="Arial">1</font></TD>
<TD align=center><font size="3" face="Arial"><strike>Math</strike></font> </TD>
<TD align=center><font size="3" face="Arial">(9)</font> </TD>
<TD align=center><font size="3" face="Arial">---</font> </TD>
<TD align=center><font size="3" face="Arial"><strike>Dohe</strike></font></TD>
<TD align=center><font size="3" face="Arial">A001</font></TD>
<TD align=center> </TD>
<TD align=center> </TD>
<TD align=center><font size="3" face="Arial">Free.</font></TD>
</TR>
</TABLE>
<script>
(function() {
var jsonArr = [];
var obj = {};
var thNum = document.getElementsByTagName('th').length;
var arrLength = document.getElementsByTagName('td').length;
for(i = 0; i < arrLength; i++){
if(i%thNum === 0){
obj = {};
}
var head = document.getElementsByTagName('th')[i%thNum].innerHTML;
var content = document.getElementsByTagName('td')[i].innerHTML;
obj[head] = content;
if(i%thNum === 0){
jsonArr.push(obj);
}
}
document.write("<br>"+JSON.stringify(jsonArr));
})();
</script>
</body>
</html>
to this:对此：
[{"Date":"24.9.","Teacher":"Dohe","?":"Free","Hour":"1","Subject":"Math ","Class":"(9) ","Room":"--- ","(Teacher)":"Dohe","(Room)":"A001","XYY":" ","Information":" ","(Le.) nach":"Free."}]
But I need the "Values" tag before and the "1", "2", wich should be created automatically by row.但是我之前需要“值”标签，而“1”、“2”应该是按行自动创建的。 And at least ist it possible to write this into a new .json file like data.json?至少可以将它写入一个新的 .json 文件，如 data.json 吗？
1 个解决方案
解决方案1
1 已采纳 2015-10-05 14:53:15
If you want to represent the array of rows as an object, change jsonArr.push(obj) to jsonObj[++rowIx] = obj , where jsonObj has previously been initialized to {} , and rowIx is a counter that has been initialized to 0 (probably simpler than doing math on i ).如果要将行数组表示为对象， jsonArr.push(obj)更改为jsonObj[++rowIx] = obj ，其中jsonObj之前已初始化为{} ，而rowIx是已初始化为的计数器0（可能比在i上做数学更简单）。
The expected output you posted is not valid JSON, so I'm assuming that it's supposed to be wrapped by another set of braces:您发布的预期输出不是有效的 JSON，所以我假设它应该被另一组大括号包裹：
document.write("<br>"+JSON.stringify({"Values": jsonObj}));
As for saving to a file, this is tricky to do in a portable manner.至于保存到文件，以可移植的方式做到这一点很棘手。 There are several other answers that address this, including the following:还有其他几个答案可以解决这个问题，包括以下内容：
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.