javascript将json格式数组下载为excel表格的方法


Posted in Javascript onDecember 22, 2017

实例如下:

<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
  <script type="text/javascript" src="jquery183.min.js"></script> 
  <script type="text/javascript"> 
    $(document).ready(function(){ 
      $('#wwo').click(function(){ 
        var data = {
"title":
[
{"value":"A1标题"}, 
{"value":"B1标题"}
],
"data":
[
[
{"value":"好好"}, 
{"value":"2015-08-24"}
],
[
{"value":"123"}, 
{"value":"hahah"}
]
]
}; 
        if(data == ''){ 
          return; 
}else{
JSONToExcelConvertor(data.data, "Report", data.title); 
}
      }); 
    }); 
 
    function JSONToExcelConvertor(JSONData, FileName, ShowLabel) { 
      //先转化json 
      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 index in arrData[i]) { 
          var value = arrData[i][index].value === "." ? "" : arrData[i][index].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); 
    } 
  </script> 
</head> 
<body> 
  <input type="button" id="wwo" value="导出" /> 
</body> 
</html>

以上这篇javascript将json格式数组下载为excel表格的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
取得窗口大小 兼容所有浏览器的js代码
Aug 09 Javascript
js调试工具Console命令详解
Oct 21 Javascript
jQuery 插件开发指南
Nov 14 Javascript
jQuery简单实现iframe的高度根据页面内容自适应的方法
Aug 01 Javascript
微信和qq时间格式模板实例详解
Oct 21 Javascript
本地搭建微信小程序服务器的实现方法
Oct 27 Javascript
基于$.ajax()方法从服务器获取json数据的几种方式总结
Jan 31 Javascript
jsonp跨域获取数据的基础教程
Jul 01 Javascript
解决vue2 在mounted函数无法获取prop中的变量问题
Nov 15 Javascript
javascript json字符串到json对象转义问题
Jan 22 Javascript
Postman参数化实现过程及原理解析
Aug 13 Javascript
js中实现继承的五种方法
Jan 25 Javascript
原生js实现移动端触摸轮播的示例代码
Dec 22 #Javascript
JavaScript多线程运行库Nexus.js详解
Dec 22 #Javascript
JS实现在文本指定位置插入内容的简单示例
Dec 22 #Javascript
JavaScript实现单例模式实例分享
Dec 22 #Javascript
vue使用axios时关于this的指向问题详解
Dec 22 #Javascript
Javascript中JSON数据分组优化实践及JS操作JSON总结
Dec 22 #Javascript
vue init失败简单解决方法(终极版)
Dec 22 #Javascript
You might like
极典R601SW收音机
2021/03/02 无线电
解决php表单重复提交实现方法
2015/09/29 PHP
php mysqli查询语句返回值类型实例分析
2016/06/29 PHP
artdialog的图片/标题以及关闭按钮不显示的解决方法
2013/06/27 Javascript
jQuery使用之标记元素属性用法实例
2015/01/19 Javascript
jquery对Json的各种遍历方法总结(必看篇)
2016/09/29 Javascript
Vue.js获取被选择的option的value和text值方法
2018/08/24 Javascript
JQuery判断radio单选框是否选中并获取值的方法
2019/01/17 jQuery
详解webpack4.x之搭建前端开发环境
2019/03/28 Javascript
JavaScript对象原型链原理解析
2020/01/22 Javascript
vue实例的选项总结
2020/06/09 Javascript
mpvue 项目初始化及实现授权登录的实现方法
2020/07/20 Javascript
浅谈vue 多个变量同时赋相同值互相影响
2020/08/05 Javascript
vue切换菜单取消未完成接口请求的案例
2020/11/13 Javascript
[01:04]不如跳舞!DOTA2新英雄玛尔斯的欢乐日常
2019/03/11 DOTA
python 字典(dict)遍历的四种方法性能测试报告
2014/06/25 Python
python中正则的使用指南
2016/12/04 Python
Python实现类的创建与使用方法示例
2017/07/25 Python
python斐波那契数列的计算方法
2018/09/27 Python
python 读取文件并把矩阵转成numpy的两种方法
2019/02/12 Python
使用pyinstaller打包PyQt4程序遇到的问题及解决方法
2019/06/24 Python
Django 源码WSGI剖析过程详解
2019/08/05 Python
利用Python脚本实现自动刷网课
2020/02/03 Python
python 安装impala包步骤
2020/03/28 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
图解CSS3制作圆环形进度条的实例教程
2016/05/26 HTML / CSS
在线吉他课程,学习如何弹吉他:Fender Play
2019/02/28 全球购物
父母对孩子的寄语
2014/04/09 职场文书
护士节演讲稿开场白
2014/08/25 职场文书
爱与责任师德演讲稿
2014/08/26 职场文书
中学生打架检讨书
2014/10/13 职场文书
2014年语文教研组工作总结
2014/12/06 职场文书
2014年妇产科工作总结
2014/12/08 职场文书
信贷客户经理岗位职责
2015/04/09 职场文书
JavaWeb 入门:Hello Servlet
2021/07/16 Java/Android
Java9新特性对HTTP2协议支持与非阻塞HTTP API
2022/03/16 Java/Android