JS前端将table导出到excel 兼容谷歌 IE 且保留表格样式
CDSN上博主给我一段代码,可将表格导出为EXCEL文档,原文见:
https://blog.csdn.net/zz210891470/article/details/94717644
向博主学习、致敬。
只是原文中缺少了isIE()函数,补充进去后,运行成功。但似乎导出的EXCEL文档并没有如原文所说的那样格式不变(拥挤在一个单元格大小的空间中)。作为借鉴学习记录下来,后面调试中试用。
function exportExcel(){
//tb是div 里面包着 table,这里就是取出table的html
var lHtml = document.getElementById("tb").innerHTML;
//这里重新组成一个你需要的文档,记得要将你需要的table样式复制写入到head头部里否则
//导出来没有表格样式 下面style标签里就是我自定义的表格样式
var tableHtml='<html><head><meta charset="UTF-8"><style>table{border-top:solid 1px #000; border-left:solid 1px #000;} td{height:25px;line-height:25px; font-size:12px; font-family:"宋体"; text-align:center; border-bottom:solid 1px #000; border-right:solid 1px #000;} #tab td{height:25px;line-height:25px; font-size:12px; font-family:"宋体";width: 82px;border-left:0px; border-bottom:solid 1px #000; border-right:solid 1px #000;} </style></head><body>';
tableHtml += lHtml;
tableHtml += '</body></html>';
var excelBlob = new Blob([tableHtml], {type: 'application/vnd.ms-excel'});
var fileName = "EXCEL.xls";
if(isIE()){
window.navigator.msSaveOrOpenBlob(excelBlob,fileName);
}else{
var oa = document.createElement('a');
oa.href = URL.createObjectURL(excelBlob);
oa.download = fileName;
document.body.appendChild(oa);
oa.click();
}
}
JS前端将table导出到excel 兼容谷歌 IE 且保留表格样式的更多相关文章
- js中的table导出成Excel表格
首先判断手否是IE,原因在于IE导出我用的是ActiveXObject,判断的方式很简单,只需要拿到window.navigator.userAgent即可进行判断,代码如下 function get ...
- html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel,保留table样式
先上代码 <script type="text/javascript" language="javascript"> var idTmr; ...
- 使用js代码将HTML Table导出为Excel
使用js代码将HTML Table导出为Excel的方法: 直接上源码 <html> <head> <meta http-equiv="Content-Type ...
- HTML Table导出为Excel的方法
HTML Table导出为Excel的方法: 直接上源码 <html> <head> <meta http-equiv="Content-Type" ...
- 使用js代码将html导出为Excel
js代码将html导出为Excel的方法: 直接上源码: <script type="text/javascript" language="javascript&q ...
- 【ASP.NET】C# 将HTML中Table导出到Excel(TableToExcel)
首先,说下应用场景 就是,把页面呈现的Table 导出到Excel中.其中使用的原理是 前台使用ajax调用aspx后台,传递过去参数值,导出.使用的组件是NPOI. 前台调用: <script ...
- Antd将Table导出为Excel
Antd将Table导出为Excel 在最近的项目中,需要把表格中的数据导出给财务进行统计,网上很多一键导出的按钮都没用.经过东拼西凑,最终搞定了导出,自己封装了组件. import { File } ...
- js将HTML中table导出到EXCEL word (只支持IE) 另用php 配合AJAX可以支持所有浏览器
转载请注明来源:https://www.cnblogs.com/hookjc/ <HTML> <HEAD> <title>WEB页面导出为EXC ...
- MVC 将视图页table导出成excel
前台代码: <table class="tablelist" id="myTable"> <thead> <t ...
随机推荐
- Bash shell类型
登录shell(需要密码) 正常通过某一个终端来登录,需要输入用户名和密码. 使用su - username 使用su -l username 非登录shell(不需要密码) su userna ...
- ASP_MVC项目设计技巧规则
对于上述这种类型的前台页面,属于典型的List型的页面,那么,对于model的设计,要考虑前台人员的负担,尽量简洁: model: Name : 对应产品名称,如FMOS_WPF.FMOS_Tun.. ...
- Spring Boot实战之定制type Formatters
本文首发于个人网站:Spring Boot实战之定制type Formatters 前面我们有篇文章介绍了PropertyEditors,是用来将文本类型转换成指定的Java类型,不过,考虑到Prop ...
- windows下安装nginx和基本配置
1.下载并安装nginx 到nginx官网上下载相应的安装包,http://nginx.org/en/download.html: 下载之后进行解压,将解压后的文件放到自己心仪的目录下,如下图所示: ...
- FHQ treap学习(复习)笔记
.....好吧....最后一篇学习笔记的flag它倒了..... 好吧,这篇笔记也鸽了好久好久了... 比赛前刷模板,才想着还是补个坑吧... FHQ,这个神仙(范浩强大佬),发明了这个神仙的数据结构 ...
- 最新JetBrains PyCharm 使用教程--常用功能设置(三)
选择代码路径和Python解释器版本 设置Pycharm菜单字体的大小 设置编辑器里面字体大小 设置文件编码 设置背景颜色 设置tab键为4个空格 设置代码内容和关键字颜色 ...
- Mac下配置nacos开机启动
nacos能正常启动后,开始制作启动app. 1.打开自带的 自动操作 2.点击选项 3.选择应用程序 4.搜索shell,点击运行Shell脚本,写入脚本,$NACOS 为nacos的绝对路径,保存 ...
- PHP微信授权登录用于多个域名的方法
PHP微信授权登录用于多个域名的方法appid和 回调地址换下就好了 <pre><!DOCTYPE html><html lang="en">& ...
- 基于docker搭建Jenkins+Gitlab+Harbor+Rancher架构实现CI/CD操作(续)---Harbor的安装
前期安装文档:https://www.cnblogs.com/lq-93/p/11828626.html Harbor的作用: 开发提交代码至gitlab容器中,Jenkins拉取代码构建镜像 ...
- 【集合系列】- 初探java集合框架图
一.集合类简介 Java集合就像一种容器,可以把多个对象(实际上是对象的引用,但习惯上都称对象)"丢进"该容器中.从Java 5 增加了泛型以后,Java集合可以记住容器中对象的数 ...