【JS】如何将网页上的Table元素下载为CSV文件

【背景】

网页上有Table元素,希望加一个按钮,实现点击按钮就下载Table元素内容为CSV文件。

【分析】

首先,由于目标是下载已经展示在网页上的Table元素内容,所以,可以直接由前端JS实现。

如果是要下载分页展示的全量文件,则不能使用此方法。

【方法】

JS功能函数:

javascript 复制代码
  <script>
    function download2(type, fn, dl) {
      var elt = document.getElementsByClassName('hover stripe dataTable no-footer')[1];
      var wb = XLSX.utils.table_to_book(elt, {sheet:"Sheet JS"});
      return dl ?
        XLSX.write(wb, {bookType:type, bookSST:true, type: 'base64'}) :
      XLSX.writeFile(wb, fn || ('BaseCustTranTable.' + (type || 'xlsx')));
    }
  </script>

Html中插入按钮元素并关联函数:

html 复制代码
  <button type="button" class="btn btn-default" onclick="download2();">
    <span class="glyphicon glyphicon-export" aria-hidden="true">页面下载</span>
  </button>
相关推荐
@木辛梓11 分钟前
指针,数组,变量
开发语言·c++·算法
漠然&&21 分钟前
实战案例:用 Guava ImmutableList 优化缓存查询系统,解决多线程数据篡改与内存浪费问题
java·开发语言·缓存·guava
不爱吃糖的程序媛33 分钟前
Electron 桌面应用开发入门指南:从零开始打造 Hello World
前端·javascript·electron
宋辰月42 分钟前
学习react第一天
javascript·学习·react.js
zhangkaixuan4561 小时前
Flink 写入 Paimon 流程:Checkpoint 与 Commit 深度剖析
java·开发语言·微服务·flink·paimon
flashlight_hi1 小时前
LeetCode 分类刷题:141. 环形链表
javascript·算法·leetcode
www_stdio1 小时前
JavaScript 中的异步编程与 Promise
javascript
Tracy-221 小时前
广东专升本计算机C语言
c语言·开发语言
多多*1 小时前
牛客周赛 Round 117 ABCDE 题解
java·开发语言·数据结构·算法·log4j·maven
liu****1 小时前
13.POSIX信号量
linux·开发语言·c++·算法·1024程序员节