在JavaScript中单击按钮时导出到Excel

有时，我们需要将我们的数据导出到Excel表中，这样我们可以更方便地对其进行分析处理。在JavaScript中，我们可以通过一些库和工具实现这一功能。

基于js-xlsx库实现Excel导出

js-xlsx是一款可以在浏览器和Node.js环境中解析、生成和转换Excel的纯JavaScript库。我们可以使用它来生成Excel文档并将其下载到客户端。

首先，我们需要引入js-xlsx库：

<script src="https://unpkg.com/xlsx/dist/xlsx.full.min.js"></script>

接下来，我们需要一个函数，它将触发Excel导出并为Excel文件创建工作表。

function exportToExcel(tableId) {
  let table = document.getElementById(tableId);
  let wb = XLSX.utils.table_to_book(table);
  let wbout = XLSX.write(wb, { bookType: "xlsx", type: "array" });
  saveAsExcelFile(wbout, "table.xlsx");
}

function saveAsExcelFile(buffer, fileName) {
  let data = new Blob([buffer], { type: "application/octet-stream" });
  let url = URL.createObjectURL(data);
  let link = document.createElement("a");
  link.setAttribute("href", url);
  link.setAttribute("download", fileName);
  link.style.display = "none";
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
}

在导出函数中，我们首先获取要导出的表的ID，然后使用table_to_book方法将该表转换为Excel工作簿。接下来，我们使用write方法将工作簿写入数组，并使用saveAsExcelFile函数将其保存到文件。

在saveAsExcelFile函数中，我们将数组转换为Blob对象，并使用createObjectURL方法创建URL对象。接下来，我们创建一个链接元素并将其附加到文档主体中。我们设置链接元素的属性，使其下载Excel文件。最后，我们单击链接元素并将其从文档主体中删除。

实例演示

为了更好地演示js-xlsx如何生成Excel，我们使用以下表格数据作为示例。

| Name | Age | Gender | | ------ | --- | ------ | | Zoe | 26 | Female | | Jack | 32 | Male | | Grace | 28 | Female | | Robert | 24 | Male |

我们将使用以下HTML代码将此数据作为表格呈现。

<table id="table">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Gender</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Zoe</td>
      <td>26</td>
      <td>Female</td>
    </tr>
    <tr>
      <td>Jack</td>
      <td>32</td>
      <td>Male</td>
    </tr>
    <tr>
      <td>Grace</td>
      <td>28</td>
      <td>Female</td>
    </tr>
    <tr>
      <td>Robert</td>
      <td>24</td>
      <td>Male</td>
    </tr>
  </tbody>
</table>

<button onclick="exportToExcel('table')">Export to Excel</button>

单击“导出到Excel”按钮将调用exportToExcel函数，并将表传递给它。此函数将在浏览器中生成并下载Excel文件。

结论

使用js-xlsx库，在JavaScript中将数据导出到Excel成为可能。我们只需要编写一些JavaScript代码即可生成和下载Excel文件。