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 相关文章推荐
5 cool javascript apps
Mar 24 Javascript
代码生成器 document.write()
Apr 15 Javascript
jQuery MD5加密实现代码
Mar 15 Javascript
jquery隔行换色效果实现方法
Jan 15 Javascript
JavaScript基本的输出和嵌入式写法教程
Oct 20 Javascript
全面了解JavaScirpt 的垃圾(garbage collection)回收机制
Jul 11 Javascript
jQuery 全选 全部选 反选 实现代码
Aug 17 Javascript
js中用cssText设置css样式的简单方法
Sep 19 Javascript
详解jQuery的Cookie插件
Nov 23 Javascript
使用node打造自己的命令行工具方法教程
Mar 26 Javascript
vue中的watch监听数据变化及watch中各属性的详解
Sep 11 Javascript
使用Canvas绘制一个游戏人物属性图
Mar 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
优化NFR之一 --MSSQL Hello Buffer Overflow
2006/10/09 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十)
2014/06/24 PHP
php中Y2K38的漏洞解决方法实例分析
2014/09/22 PHP
php图片的二进制转换实现方法
2014/12/15 PHP
php精确的统计在线人数的方法
2015/10/21 PHP
WordPress的主题编写中获取头部模板和底部模板
2015/12/28 PHP
浅谈PHP值mysql操作类
2016/06/29 PHP
jsp+javascript打造级连菜单的实例代码
2013/06/14 Javascript
JavaScript生成GUID的多种算法小结
2013/08/18 Javascript
js综合应用实例简单的表格统计
2013/09/03 Javascript
js简单工厂模式用法实例
2015/06/30 Javascript
JQuery+EasyUI轻松实现步骤条效果
2016/02/22 Javascript
js实现下一页页码效果
2017/03/07 Javascript
深入理解Vue 单向数据流的原理
2017/11/09 Javascript
Vue.js+Layer表格数据绑定与实现更新的实例
2018/03/07 Javascript
vue实现学生录入系统之添加删除功能
2018/07/11 Javascript
微信提示 在浏览器打开 效果实现过程解析
2019/09/10 Javascript
微信小程序绑定手机号获取验证码功能
2019/10/22 Javascript
解决VantUI popup 弹窗不弹出或无蒙层的问题
2020/11/03 Javascript
微信小程序input抖动问题的修复方法
2021/03/03 Javascript
Python获取apk文件URL地址实例
2013/11/01 Python
使用sklearn之LabelEncoder将Label标准化的方法
2018/07/11 Python
Python参数类型以及常见的坑详解
2019/07/08 Python
在keras中获取某一层上的feature map实例
2020/01/24 Python
python中shell执行知识点
2020/05/06 Python
最新Python idle下载、安装与使用教程图文详解
2020/11/28 Python
html5实现多图片预览上传及点击可拖拽控件
2018/03/15 HTML / CSS
WiFi云数码相框:Nixplay
2018/07/05 全球购物
Myprotein亚太地区:欧洲第一在线运动营养品牌
2020/12/20 全球购物
求∏的近似值,直到最后一项的绝对值小于指定的数
2016/02/12 面试题
研发工程师的岗位职责
2013/11/18 职场文书
个性大学生自我评价
2013/12/04 职场文书
竞选劳动委员演讲稿
2014/04/28 职场文书
小学感恩节活动策划方案
2014/10/06 职场文书
2014年招生工作总结
2014/11/26 职场文书
生活小常识广播稿
2015/08/19 职场文书