Convert HTML Table to Json

Question

Is it possible to convert a HTML table to json like this:

Name Gender Age

John M 18

{
            "name": "John",
            "Gender": "M",
            "Age": "18"
        },

A Programm that we uses generates us a HTM file, wich I want to convert. But I've never seen such a Format before :D. Most of the time im an iOS developer. My Table in HTML Look like this:

<TABLE border="3" rules="all" bgcolor="#E7E7E7" cellpadding="1" cellspacing="1">
<TR>
<TD align=center><font size="3" face="Arial">
Date
</font> </TD>
<TD align=center><font size="3" face="Arial">
<B>Teacher</B>
</font> </TD>
<TD align=center><font size="3" face="Arial">
?
</font> </TD>
<TD align=center><font size="3" face="Arial">
Hour
</font> </TD>
<TD align=center><font size="3" face="Arial">
Subject
</font> </TD>
<TD align=center><font size="3" face="Arial">
Class    </font> </TD>
<TD align=center><font size="3" face="Arial">
Room
</font> </TD>
<TD align=center><font size="3" face="Arial">
(Teacher)
</font> </TD>
<TD align=center><font size="3" face="Arial">
(Room)
</font> </TD>
<TD align=center><font size="3" face="Arial">
XYY
</font> </TD>
<TD align=center><font size="3" face="Arial">
<B>Information</B>
</font> </TD>
<TD align=center><font size="3" face="Arial">
(Le.) nach
</font> </TD>
</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>&nbsp;</TD>
<TD align=center>&nbsp;</TD>
<TD align=center><font size="3" face="Arial">
Free.
</font> </TD>
</TR><TR>

Answer 1

JavaScript:

(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));
})();

http://jsfiddle.net/decv1vs2/1/

Or in your case:

http://jsfiddle.net/decv1vs2/2/ (change headers to or add classes)

Answer 2

Try this:

$('#btnid').click( function() {
 var table = $('#tableid').tableToJSON();  
});