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获取电脑信息(是使用与IE浏览器)
Jan 15 Javascript
js动态给table添加/删除tr的方法
Aug 02 Javascript
写得不错的jquery table鼠标经过变色代码
Sep 27 Javascript
JavaScript匿名函数用法分析
Feb 13 Javascript
jQuery实现简单的列表式导航菜单效果代码
Aug 31 Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
May 18 Javascript
jQuery基于BootStrap样式实现无限极地区联动
Aug 26 Javascript
Angularjs实现分页和分页算法的示例代码
Dec 23 Javascript
JS原型与原型链的深入理解
Feb 15 Javascript
老生常谈combobox和combotree模糊查询
Apr 17 Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 Javascript
node运行js获得输出的三种方式示例详解
Jul 02 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
win7+apache+php+mysql环境配置操作详解
2013/06/10 PHP
PHP输出一个等腰三角形的方法
2015/05/12 PHP
ThinkPHP中使用Ueditor富文本编辑器
2015/09/02 PHP
PHP编程实现阳历转换为阴历的方法实例
2017/08/08 PHP
php 处理png图片白色背景色改为透明色的实例代码
2018/12/10 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
Javascript代码混淆综合解决方案-Javascript在线混淆器
2006/12/18 Javascript
jquery radio 操作代码
2011/03/16 Javascript
jQuery ui插件的使用方法代码实例
2013/05/08 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
javascript客户端遍历控件与获取父容器对象示例代码
2014/01/06 Javascript
ECMAScript6函数默认参数
2015/06/12 Javascript
jQuery height()、innerHeight()、outerHeight()函数的区别详解
2016/05/23 Javascript
jQuery+css实现非常漂亮的水平导航菜单效果
2016/07/27 Javascript
vue.js 初体验之Chrome 插件开发实录
2017/05/13 Javascript
在 Angular中 使用 Lodash 的方法
2018/02/11 Javascript
echarts鼠标覆盖高亮显示节点及关系名称详解
2018/03/17 Javascript
JS实现的缓冲运动效果示例
2018/04/30 Javascript
vue 2.8.2版本配置刚进入时候的默认页面方法
2018/09/21 Javascript
详解基于Vue的支持数据双向绑定的select组件
2019/09/02 Javascript
Python实现的简单万年历例子分享
2014/04/25 Python
python中的__slots__使用示例
2015/02/26 Python
python使用opencv按一定间隔截取视频帧
2018/03/06 Python
在windows下Python打印彩色字体的方法
2018/05/15 Python
python 计算方位角实例(根据两点的坐标计算)
2020/01/17 Python
python判断字符串以什么结尾的实例方法
2020/09/18 Python
html5手机端页面可以向右滑动导致样式受影响的问题
2018/06/20 HTML / CSS
html2 canvas生成清晰的图片实现打印功能
2019/09/23 HTML / CSS
写一个用矩形法求定积分的通用函数
2012/11/08 面试题
大学生的自我鉴定范文
2014/01/21 职场文书
消防安全检查制度
2014/02/04 职场文书
实习科室评语
2015/01/04 职场文书
二年级语文上册复习计划
2015/01/19 职场文书
2015年环保局工作总结
2015/05/22 职场文书
商业计划书之服装
2019/09/09 职场文书
只用Python就可以制作的简单词云
2021/06/07 Python