Skip to main content

How to Export an HTML Table to an Excel File in JavaScript

Exporting data from an HTML table into a downloadable Excel (.xlsx) file is a common feature for data-driven web applications. While it may seem complex, the process is made incredibly simple by using a dedicated and powerful library. Direct, "vanilla JS" approaches are generally not recommended as they are unable to create a proper, modern Excel file.

This guide will explain why a library is the best choice and walk you through the standard method using the popular SheetJS library. You will learn how to set up the library and export any HTML table to a valid .xlsx file with just a few lines of code.

The Core Problem: Creating a True .xlsx File​

A modern Excel (.xlsx) file is a complex, compressed archive of XML files. It is not something that can be created by simply manipulating HTML strings. You will find older "vanilla JS" solutions online that create a file with an .xls extension, but these are often just disguised HTML files. When a user opens such a file in Excel, they will get a warning message:

The file format and extension... don't match. The file could be corrupted or unsafe.

To create a valid, modern .xlsx file that opens without warnings, you must use a library that understands the Office Open XML format.

SheetJS (also known as xlsx) is the most popular and robust open-source library for working with spreadsheets in JavaScript. It can read, edit, and write a wide variety of spreadsheet formats, including .xlsx.

The simplest way to use it is to include it from a CDN. Add the following <script> tag to the <head> of your HTML file.

<head>
  <script src="https://cdn.sheetjs.com/xlsx-0.20.0/package/dist/xlsx.full.min.js"></script>
</head>

This will make the XLSX global object available in your script.

How to Use SheetJS to Export a Table​

The logic is a simple, two-step process:

  1. Use XLSX.utils.table_to_book() to read the DOM <table> element and convert it into a "workbook" object.
  2. Use XLSX.writeFile() to trigger a browser download of that workbook as an .xlsx file.

For example, you have an HTML table and a button, and you want to export the table to Excel when the button is clicked.

HTML:

<table id="my-table">
  <thead>
    <tr>
      <th>Name</th>
      <th>Country</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td>Canada</td>
    </tr>
    <tr>
      <td>Bob</td>
      <td>USA</td>
    </tr>
  </tbody>
</table>

<button id="export-btn">Export to Excel</button>

JavaScript:

const exportButton = document.getElementById('export-btn');
const table = document.getElementById('my-table');

exportButton.addEventListener('click', () => {
  // 1. Convert the table to a workbook object
  const workbook = XLSX.utils.table_to_book(table, { sheet: 'Sheet1' });
  
  // 2. Trigger the download of the workbook as an XLSX file
  XLSX.writeFile(workbook, 'MyTable.xlsx');
});

That's all it takes. When the user clicks the button, the browser will download a perfectly formatted MyTable.xlsx file.

As mentioned earlier, older solutions that attempt to do this without a library typically use a "Data URI" scheme.

The Outdated and Not Recommended Method:

// ⛔️ This is an outdated and unreliable method
function exportToExcel(table) {
  const html = table.outerHTML;
  const url = 'data:application/vnd.ms-excel,' + encodeURIComponent(html);
  const link = document.createElement('a');
  link.href = url;
  link.download = 'table.xls';
  link.click();
}

This method is not recommended because:

  • It generates a file that is not a true Excel file, leading to security warnings for the user.
  • It has poor support for non-ASCII characters and complex formatting.
  • It is less reliable and more prone to browser-specific issues.

Conclusion​

For exporting an HTML table to a modern Excel (.xlsx) file, the choice is clear.

  • A library is required to create a valid, warning-free .xlsx file.
  • The SheetJS (xlsx) library is the recommended best practice. It is powerful, easy to use, and the industry standard.
  • The process is simple: use XLSX.utils.table_to_book() to create a workbook from your table, and XLSX.writeFile() to trigger the download.

By using a dedicated library, you can provide a professional and seamless export experience for your users.

Table of Contents