Js 导出table内容到Excel的简单实例

首先我会讲解如何通过js导出table内容到Excel。以下是完整的攻略：

准备工作

• 编写html页面，并在页面中创建一个table并填充数据
• 导入jquery、TableExport等库文件

步骤

1. 加载TableExport插件库文件

<script src="js/FileSaver.min.js"></script>
<script src="js/tableExport.js"></script>

1. 配置TableExport参数及点击事件

$(function(){
  var $exportLink = $('#export');
  $exportLink.on('click',function(){
    $('table').tableExport({
      type:'excel',
      escape:'false',
      fileName:'demo'
    });
  });
});

其中，$exportLink是一个a标签，在点击事件中调用TableExport插件，将table导出为Excel文件，默认文件名为demo。

1. 刷新页面，点击导出按钮，即可下载Excel文件。

示例说明：

假设我们有一个表格，需要将其导出为Excel文件。表格如下：

<table>
  <thead>
    <tr>
      <th>学号</th>
      <th>姓名</th>
      <th>性别</th>
      <th>年龄</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>001</td>
      <td>张三</td>
      <td>男</td>
      <td>22</td>
    </tr>
    <tr>
      <td>002</td>
      <td>李四</td>
      <td>男</td>
      <td>23</td>
    </tr>
    <tr>
      <td>003</td>
      <td>王五</td>
      <td>女</td>
      <td>21</td>
    </tr>
  </tbody>
</table>

我们将在表格上方添加一个导出按钮，点击该按钮即可下载Excel文件。

<a id="export" href="#">导出Excel</a>

然后就可以按照上文所示的步骤来操作了。

另一个示例：

假设我们需要导出两个表格，一个按学生姓名排序，另一个按学生年龄排序。我们需要分别为两个按钮绑定点击事件，操作步骤与上文类似，但需要在调用TableExport的时候，对每个表格传递不同的参数。

$(function(){
  $('#export-by-name').on('click',function(){
    $('#table-name').tableExport({
      type:'excel',
      escape:'false',
      fileName:'sort-by-name'
    });
  });
  $('#export-by-age').on('click',function(){
    $('#table-age').tableExport({
      type:'excel',
      escape:'false',
      fileName:'sort-by-age'
    });
  });
});

以上就是如何使用JS将table内容导出为Excel文件的说明。