Convert Any Table to JSON

by Joe Saad

HTML

<table>
    <thead>
        <th>Name</th>
        <th>City</th>
        <th>Age</th>
    </thead>
    <tbody>
        <tr>
            <td>Shaker</td>
            <td>Houston</td>
            <td>34</td>
        </tr>
        <tr>
            <td>Mena</td>
            <td>Las Vegas</td>
            <td>27</td>
        </tr>
        <tr>
            <td>Joe</td>
            <td>Austin</td>
            <td>34</td>
        </tr>
    </tbody>
</table>
<div id="generatedJSON"></div>

CSS

table, tr, th, td {
    border-collapse: collapse;
    border: 1px solid #ccc;
}

JavaScript

var myArr = [],
    prop,
    propVal;

for (var i = 1; i < $('tbody tr').length + 1; i++) {
    var obj = {};
    for (var j = 1; j < $('th').length + 1; j++) {
        prop = $('th:nth-child(' + j + ')').text().toLowerCase();
        propVal = $('tbody tr:nth-child(' + i + ') td:nth-child(' + j + ')').text();
        obj[prop] = propVal;
    }
    myArr.push(obj);
}

myArr = JSON.stringify(myArr);
alert(myArr);

$('#generatedJSON').text(myArr);