1、导出当前页面,这是最简单的,只是导出当前页面的数据。

exportData(tableid, name) {
let table;
let uri = 'data:application/vnd.ms-excel;base64,',
template = '<html><head><meta charset="UTF-8"></head><body><table border="1">{table}</table></body></html>',
base64 = function (
s) {
return window.btoa(unescape(encodeURIComponent(s)))
},
format = function (s, c) {
return s.replace(/{(\w+)}/g, function (m, p) {
return c[p];
})
}; table = document.getElementById(tableid)
let ctx = {
worksheet: name || 'Worksheet',
table: table.innerHTML
};
window.location.href = uri + base64(format(template, ctx))
},

2、导出有分页的数据

exportData2() {
let table;//把所有要导出的数据全部封装成tbody内的数据,然后导出
let uri = "data:application/vnd.ms-excel;base64,",
template =
'<html><head><meta charset="UTF-8"></head><body><table border="1">{table}</table></body></html>',
base64 = function(s) {
return window.btoa(unescape(encodeURIComponent(s)));
},
format = function(s, c) {
return s.replace(/{(\w+)}/g, function(m, p) {
return c[p];
});
};
let ctx = {
worksheet:"导出",
table: table
};
window.location.href = uri + base64(format(template, ctx));
},

当前导出的话,我目前在我司的项目上应用,导出超过700条,数据就会在base64处转化失败,建议导出如果超过700条时,可以进行二次封装,每次只是500条,可以存两个变量,一个是{table},一个是base64转化后的数据,然后组合起来,直至数据获取完毕,然后再导出

前端自己导出Excel的更多相关文章

  1. # vue 如何通过前端来导出excel表格

    在做一些简单的demo时,偶尔会遇到导出excel表格.如果请后端帮忙的话 比较浪费时间,那么前端如何导出excel表格,下面就来记录一下之前使用到的案例 一.安装依赖 npm i file-save ...

  2. 前端 json 导出 excel

    参考:https://blog.csdn.net/abel_yang/article/details/78684786 在github上有大神提供现成的插件,非常感谢 https://cuikangj ...

  3. 前端实现导出excel

    结果: 将网页上拿到的数据导出成excel文件 实现: HTML代码 <div> <button type="button" onclick="expo ...

  4. js 前端 table 导出 excel

    园子,github,stackoverflow 关于前端下载的文章不少 园子里大部分都是 利用ActiveXObject对象来实现,可他有个缺点安全等级,还有必须安装excel…… github,st ...

  5. vue项目,前端导出excel

    今天研究一下前端如何导出excel,边查边实践,边记录 1.安装依赖库 xlsx:这是一个功能强大的excel处理库,但是上手难度也很大,还涉及不少二进制的东西 file-saver:ES5新增了相关 ...

  6. 如何使用JavaScript实现前端导入和导出excel文件

    一.SpreadJS 简介 SpreadJS 是一款基于 HTML5 的纯 JavaScript 电子表格和网格功能控件,以“高速低耗.纯前端.零依赖”为产品特色,可嵌入任何操作系统,同时满足 .NE ...

  7. Atitit.导出excel功能的设计 与解决方案

    Atitit.导出excel功能的设计 与解决方案 1.1. 项目起源于背景1 1.2. Js  jquery方案(推荐)jquery.table2excel1 1.3. 服务器方案2 1.4. 详细 ...

  8. 前端导出Excel兼容写法

    今天整理出在Web前端导出Excel的写法,写了一个工具类,对各个浏览器进行了兼容. 首先,导出的数据来源可能有两种: 1. 页面的HTML内容(一般是table) 2. 纯数据 PS:不同的数据源, ...

  9. 前端导出excel数据-jsonToExcel

    咳咳,好久没有写博了... 在工作中遇到了纯前端,将数据导出为excel文件.正文开始: 第一步 安装依赖: npm i xlsx 第二步 写导出函数: import XLSX from 'xlsx' ...

随机推荐

  1. Codeforces 1029B. Creating the Contest 动态规划O(nlogn)解法 及 单调队列O(n)解法

    题目链接:http://codeforces.com/problemset/problem/1029/B 题目大意:从数组a中选出一些数组成数组b,要求 b[i+1]<=b[i]*2 . 一开始 ...

  2. 静态站点生成器-md-pelican

    推荐指数:

  3. 如何固定table表格宽度,样式不受容器影响

    之前有篇关于LODOP打印超文本表格,两个样式相同的表格,出现错位的情况.该博文地址:LODOP打印表格错位的几种情况该文试验了两种现象,第一种浏览器页面显示错位,打印预览也错位,第二种浏览器页面表格 ...

  4. 亲爱的mssql码农们,看看利用sp_addlinkedserver实现远程数据库链接

    亲爱的mssql码农们,可以看看本地连接远程的数据库方式(sp_addlinkedserver)--通过代码连接 --查看当前链接情况: select * from sys.servers; --使用 ...

  5. PHP使用glob方法遍历文件夹下所有文件

    PHP使用glob方法遍历文件夹下所有文件 遍历文件夹下所有文件,一般可以使用opendir 与 readdir 方法来遍历.<pre><?php$path = dirname(__ ...

  6. linux 源码安装JAVA jdk

    下载Linux环境下的jdk1.8,请去(官网)中下载jdk的安装文件: 由于我的Linux是64位的,因此我下载jdk-8u131-linux-x64.tar.gz. 下载之后 解压命令进行解压 1 ...

  7. Linux下交换文件说明

    vi写文件,没有保存就关闭,会自动生成一个后缀为.swp的交换文件(隐藏文件),保存了前面写的内容 先利用R恢复,在删除这个交换文件 涉及到的命令 ls –a rm .xxx.swap -rf 

  8. IDEA好用插件推荐

    Maven Helper:排查maven依赖冲突神器,强力推荐! Alibaba Java Coding Guidelines:阿里巴巴编程规范 CamelCase:驼峰命名工具,SHIFT + AL ...

  9. FPS 游戏实现D3D透视

    FPS游戏可以说一直都比较热门,典型的代表有反恐精英,穿越火线,绝地求生等,基本上只要是FPS游戏都会有透视挂的存在,而透视挂还分为很多种类型,常见的有D3D透视,方框透视,还有一些比较高端的显卡透视 ...

  10. java 禁用科学计数法

    禁用科学计数法 Double num = 80000000000.000001; System.out.println("默认计数法:num=" + num); NumberFor ...