最近做的一个项目涉及到把数据导出到excel里面，网上找来找去，最终找到两种办法，废话不多说了

第一种:

拿到表格的id就可以抓取表格的数据，导出到excel，这种方式简单粗暴，引入这两个插件即可。

但是用这种方式会出现一种问题，就是当你的table有分页的情况下，这玩意只能抓取页面上的值，所以也不用多说了，其他分页的是导不出来的，值能导出当前分页的数据。

但是项目要求必须导出所有数据，这就出现了第二种解决方案，

使用起来也比较简单，拿到数据直接往里面塞就是了，最后调用方法。这样的话最终所有数据都出来了。

function JSONToExcelConvertor(JSONData, FileName, ShowLabel) {
 
var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
 
var excel = '<table>';
 
//设置表头
var row = "<tr>";
for (var i = 0, l = ShowLabel.length; i < l; i++) {
         row += "<td>" + ShowLabel[i].value + '</td>';
}
 
//换行
excel += row + "</tr>";
 
//设置数据
for (var i = 0; i < arrData.length; i++) {
     var row = "<tr>";
 
   for(var j=0;j<arrData[i].length;j++){
     var value = arrData[i][j].value === "." ? "" : arrData[i][j].value;
     row += '<td>' + value + '</td>';
  }
   excel += row + "</tr>";
}
 
excel += "</table>";
 
var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";
excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';
excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';
excelFile += '; charset=UTF-8">';
excelFile += "<head>";
excelFile += "<!--[if gte mso 9]>";
excelFile += "<xml>";
excelFile += "<x:ExcelWorkbook>";
excelFile += "<x:ExcelWorksheets>";
excelFile += "<x:ExcelWorksheet>";
excelFile += "<x:Name>";
excelFile += "{worksheet}";
excelFile += "</x:Name>";
excelFile += "<x:WorksheetOptions>";
excelFile += "<x:DisplayGridlines/>";
excelFile += "</x:WorksheetOptions>";
excelFile += "</x:ExcelWorksheet>";
excelFile += "</x:ExcelWorksheets>";
excelFile += "</x:ExcelWorkbook>";
excelFile += "</xml>";
excelFile += "<![endif]-->";
excelFile += "</head>";
excelFile += "<body>";
excelFile += excel;
excelFile += "</body>";
excelFile += "</html>";
 
 
var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);
 
var link = document.createElement("a");
link.href = uri;
 
link.style = "visibility:hidden";
link.download = FileName + ".xls";
 
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
var JSON_DATA = {
    "title":[
                 {"value":"司机", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"日期", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"物流单数量", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"退货单数量", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"发货总件数", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"退货总件数", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"拒收总件数", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"取消发货总件数", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"物流费总金额    ", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"代收手续费总金额", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                 {"value":"代收货款总金额", "type":"ROW_HEADER_HEADER", "datatype":"string"}
        ],
       "data":[
 
        ] 
};

json数据导出excel的更多相关文章

  1. JS 在页面上直接将json数据导出到excel，支持chrome,edge,IE10+,IE9,IE8,Safari,Firefox

    JS 在页面上直接将json数据导出到excel,支持chrome,edge,IE10+,IE9,IE8,Safari,Firefox <html> <head> </h ...

  2. JavaScript 上万条数据 导出Excel文件（改装版）

    最近项目要js实现将数据导出excel文件,网上很多插件实现~~那个开心呀,谁知道后面数据量达到上万条时出问题:浏览器不仅卡死,导出的excel文件一直提示网络失败.... debug调试发现var  ...

  3. JavaScript 上万条数据 导出Excel文件 页面卡死

    最近项目要js实现将数据导出excel文件,网上很多插件实现~~那个开心呀,谁知道后面数据量达到上万条时出问题:浏览器不仅卡死,导出的excel文件一直提示网络失败.... debug调试发现var  ...

  4. js 实现纯前端将数据导出excel两种方式，亲测有效

    由于项目需要,需要在不调用后台接口的情况下,将json数据导出到excel表格,兼容chrome没问题,其他还没有测试过 通过将json遍历进行字符串拼接,将字符串输出到csv文件,输出的文件不会再是 ...

  5. 彻底理解使用JavaScript 将Json数据导出CSV文件

    前言 将数据报表导出,是web数据报告展示常用的附带功能.通常这种功能都是用后端开发人员编写的.今天我们主要讲的是直接通过前端js将数据导出Excel的CSV格式的文件. 原理 首先在本地用Excel ...

  6. 百度地图里面搜索到的公司商家电话导出表格？怎样将把百度地图里面搜索到的公司 电话 地址 等数据导出excel里？

    好多人在问:如何将百度地图里面搜索到的公司商家电话导出表格?怎样将把百度地图里面搜索到的公司 电话 地址 等数据导出excel里? 现在,很多人都在网络上找商家,联系业务. 百度地图里有很多的商家联系 ...

  7. 【asp.net】将GridView数据导出Excel

    概要: 中午睡了一会,醒来的时候看到老师叫我去办公室,需求是这样的,把excel表中的每个同学,判断图片目录中是否有对应的照片(图片的名字用的学号或身份证号码) 没有对应图片的学生记录,存入自己的数据 ...

  8. Java使用POI实现数据导出excel报表

    Java使用POI实现数据导出excel报表 在上篇文章中,我们简单介绍了java读取word,excel和pdf文档内容 ,但在实际开发中,我们用到最多的是把数据库中数据导出excel报表形式.不仅 ...

  9. 将页面中表格数据导出excel格式的文件（vue）

    近期由于项目需要,需要将页面中的表格数据导出excel格式的文件,折腾了许久,在网上各种百度,虽然资料不少,但是大都不全,踩了许多坑,总算是皇天不负有心人,最后圆满解决了. 1.安装相关依赖(npm安 ...

随机推荐

  1. 伤不起的微信小程序

    前段时间不是很忙,刚好公司需要开发一个微信小程序,于是我就入坑了(此坑还是有点深滴,请备好干粮). 我是一名iOS开发工程师,个人觉得入门开发小程序的话,需要基本的web前端知识,比如说:代码的书写格 ...

  2. where id in用 order by field 保持排序

    转载自http://blog.linuxphp.org/archives/1588/ 先看下mysql的默认排序 select id from article where id in(63261,63 ...

  3. 利用PowerShell 得到 进程总共占用的内存

    $task = tasklist /nh /fo csv $total = 0 for($i=0; $i -lt $task.count; $i++) { $one = $task[ $i ].Spl ...

  4. AngularJS学习篇（二十二）

    AngularJS 依赖注入 什么是依赖注入 wiki 上的解释是:依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或 ...

  5. HashMap面试题：90%的人回答不上来

    在java面试中集合类似乎已经是绕不开的话题,对于一个中高级java程序员来说如果对集合类的内部原理不了解,基本上面试都会被pass掉.下面从面试官的角度来聊聊一个候选者应该对HashMap了解到什么 ...

  6. Chartist.js-同时画柱状图和折线图

    最近几天都在研究chartist,因为echarts生成的图是位图,导成PDF的时候不够清晰.而chartist是搜到的免费插件中呼声较高的,基于SVG. 今天主要是想举一些代码例子给大家,介绍下如何 ...

  7. java 中 final 的用法

    /* final可以修饰类,方法,变量 特点: final可以修饰类,该类不能被继承. final可以修饰方法,该方法不能被重写.(覆盖,复写) final可以修饰变量,该变量不能被重新赋值.因为这个 ...

  8. 配置mysql为主主复制步骤

    mysql版本:mysql-5.6.24-solaris10-sparc-64bit.tar 操作系统:solaris 11g u10 操作用户:使用非root进行操作安装,a路服务器ip地址为192 ...

  9. plsql远程连接虚拟机上的oracle

    下载oracle instantclient_11_2和plsql 将oracle instantclient_11_2解压到任意目录 在此目录下新建network,在network目录下新建admi ...

  10. jenkins+docker 持续构建非docker in docker jenkins docker svn maven

    工欲善其事必先利其器,为了解脱程序员的,我们程序员本身发明了很多好用的工具,通过各种工具的组合来达到我们想要的结果 本文采用jenkins docker svn maven作为相关工具,项目sprin ...