Convert HTML Table to Excel in JavaScript

Reading Time: < 1 minute

In most cases, we want to implement an Excel export option in our tables in both static and dynamic HTML pages. Here is a simple solution to do that task easily.

HTML Table

<table>
<thead>
<tr>
<th>S.No.</th>
<th>Student Name</th>
<th>Mark</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>John</td>
<td>30</td>
</tr>
<tr>
<td>002</td>
<td>Austine</td>
<td>43</td>
</tr>
</tbody>
</html>

Export Action Button

<button id="btnExport" onclick="fnExcelReport('excelexportfile.xlsx');">Export Excel</button>

In Footer (JavaScript part)

<script src="https://cdn.jsdelivr.net/gh/linways/table-to-excel@v1.0.4/dist/tableToExcel.js"></script>
<script>
function fnExcelReport(fileName) {
            let table = document.getElementsByTagName("table");
            return TableToExcel.convert(table[0], {
                name: fileName,
                sheet: {
                    name: 'DataSheet'
                }
            });
        }
</script>