JavaScript生成.xls文件的代码


Posted in Javascript onDecember 22, 2016

贴代码,一切尽在注释中

<html>
<head> 
<meta charset="utf-8"> 
</head> 
<body> 
<input type="button" value="下载设备模板" onclick="foo;" /> 
<script type="text/javascript" language="javascript"> 
var downloadTemplate = function 
{
/** * 根据所给数据创建并返回单行 tr节点 * data (必选), tag (可选, 标识创建的节点类型) **/
var getTr=function(data,tag)
{
var tr=document.createElement("tr"); for(var i=0;i<data.length;i++)
{ 
var item=document.createElement(tag||"td"); item.innerHTML=data[i]; tr.appendChild(item);
} 
return tr;
}
; /** * 根据所给数据创建并返回 table节点 * data (可选,无则返回空的table节点), head(可选, 标识是否存在表头) **/
var getTable=function(data,head)
{
var table=document.createElement("table");
var head=head||false; //存在表头设标识为th,否则为td
var tag=head?"th":"td"; //判断是一维||二维,执行不同逻辑
if(data[0] instanceof Array)
{ 
for(var i=0;i<data.length;i++)
{
//第一行数据根据tag创建节点类型 
(i==0)?table.appendChild(getTr(data[i],tag)):table.appendChild(getTr(data[i]));
}
}
else if(data instanceof Array)
table.appendChild(getTr(data,tag));
return table; 
}
; /** * table (必选, table节点) * uri 为生成excel的头部标签 * xmlns xml命名空间 * 返回xls资源 **/
var getXls=function(table)
{
var uri = 'data:application/vnd.ms-excel;base64,';
var template = '<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">'+ '<head>'+ '<!--[if gte mso 9]>'+ '<xml>'+ '<x:ExcelWorkbook>'+ '<x:ExcelWorksheets>'+ '<x:ExcelWorksheet>'+ '<x:WorksheetOptions>'+ '<x:DisplayGridlines/>'+ '</x:WorksheetOptions>'+ '</x:ExcelWorksheet>'+ '</x:ExcelWorksheets>'+ '</x:ExcelWorkbook>'+ '</xml>'+ '<![endif]-->'+ '</head>'+ '<body>'+ '<table>{table}</table>'+ '</body>'+ '</html>'; 
/** * 转码 base 64 * window.btoa能从ascii/二进制流中创建一个base64编码的字符串 * escape编码 unescape 解码字符串 * encodeURIComponent编码 DecodeURIComponent 解码字符串 **/ 
var base64 = function(s)
{ 
return window.btoa(unescape(encodeURIComponent(s))); 
};
//返回替换完具体数据的xls模板 var getXlsXml = function(template,data)
{
return template.replace(/{(\w+)}/g,data);
};
//返回资源链接
return uri+base64(getXlsXml(template, table.innerHTML));
};
/** * IE浏览器 * 使用Microsoft ActiveXObject组件生成xls ( 只兼容IE浏览器,选择允许加载组件 ) * table(必选, table节点) **/
var msDownload=function(data)
{
var xls = new ActiveXObject("Excel.Application"); 
xls.visible = true;
var xlsBook = xls.Workbooks.Add;
var xlsheet = xlsBook.Worksheets(1); 
for(var i=0;i<data.length;i++)
if(data[0] instanceof Array) 
for(var j=0;j<data[0].length;j++)
xlsheet.Cells(i+1,j+1).Value=data[i][j]; else xlsheet.Cells(1,i+1).Value=data[i]; //用完释放 xls=null; };
//参数: data(必选,一维||二维 数组), head(可选, 标识是否存在表头)
var download=function(data , head)
{ 
if(window.navigator.userAgent.indexOf("MSIE") >= 0)
msDownload(data);
else //下载(RestFul:资源下载置于超链接,地址为资源定位地址)
window.location.href =getXls(getTable(data,head));
}; 
return 
{ 
getXls:getXls, msDownload:msDownload, download:download
};
}; 
//测试数据 var od=['aid','pwd','设备名称','网关DK','区域'];
var td=[ ['aid','pwd','设备名称','网关DK','区域'], ['10086','root','松下R-399','208564165456542','2 #201'], ['10001','root','索尼SUV 09','456542895564165','2 #201'] ];
var foo=function
{ 
// new downloadTemplate.download(od,true); 
new downloadTemplate.download(td,true); 
}
; 
</script>
</body> 
</html>

测试结果:

在IE浏览器上需要允许加载ActiveX控件,之后在弹出的对话框中点击"是"

JavaScript生成.xls文件的代码

下载下来的表格如下:

JavaScript生成.xls文件的代码

chrome:

JavaScript生成.xls文件的代码

打开表格:

JavaScript生成.xls文件的代码

以上所述是小编给大家介绍的JavaScript生成.xls文件的代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Code:findPosX 和 findPosY
Dec 20 Javascript
本地图片预览(支持IE6/IE7/IE8/Firefox3)经验总结
Mar 25 Javascript
jQuery垂直多级导航菜单代码分享
Aug 18 Javascript
javascript巧用eval函数组装表单输入项为json对象的方法
Nov 25 Javascript
jQuery插件实现适用于移动端的地址选择器
Feb 18 Javascript
jquery获取点击控件的绝对位置简单实例
Oct 13 Javascript
jquery ajaxfileupload异步上传插件使用详解
Feb 08 Javascript
JavaScript的继承实现小结
May 07 Javascript
基于Jquery Ajax type的4种类型(详解)
Aug 02 jQuery
vue中appear的用法
Aug 17 Javascript
用Node编写RESTful API接口的示例代码
Jul 04 Javascript
vue实现在线预览pdf文件和下载(pdf.js)
Nov 26 Javascript
微信小程序 表单Form实例详解(附源码)
Dec 22 #Javascript
微信小程序 122100版本更新问题解决方案
Dec 22 #Javascript
JS闭包与延迟求值用法示例
Dec 22 #Javascript
jQuery实现两个select控件的互移操作
Dec 22 #Javascript
JS 调用微信扫一扫功能
Dec 22 #Javascript
Vue实现双向绑定的方法
Dec 22 #Javascript
JS实现物体带缓冲的间歇运动效果示例
Dec 22 #Javascript
You might like
php采集速度探究总结(原创)
2008/04/18 PHP
PHP验证码类代码( 最新修改,完全定制化! )
2010/12/02 PHP
php 把数字转换成汉字的代码
2015/07/21 PHP
php数据结构之顺序链表与链式线性表示例
2018/01/22 PHP
PHP实现 APP端微信支付功能
2018/06/22 PHP
javascript中substr,substring,slice.splice的区别说明
2010/11/25 Javascript
Ubuntu 11.10 安装Node.js的方法
2011/11/30 Javascript
javascript的内存管理详解
2013/08/07 Javascript
动态读取JSON解析键值对的方法
2014/06/03 Javascript
一个JavaScript防止表单重复提交的实例
2014/10/21 Javascript
Javascript实现div层渐隐效果的方法
2015/05/30 Javascript
jQuery解析XML文件同时动态增加js文件的方法
2015/06/01 Javascript
详解AngularJS中的作用域
2015/06/17 Javascript
node.js express中app.param的用法详解
2017/07/16 Javascript
微信小程序开发之好友列表字母列表跳转对应位置
2017/09/26 Javascript
微信小程序添加插屏广告并设置显示频率(一天一次)
2019/12/06 Javascript
vue监听dom大小改变案例
2020/07/29 Javascript
antd vue table跨行合并单元格,并且自定义内容实例
2020/10/28 Javascript
python实现udp数据报传输的方法
2014/09/26 Python
Python中对象迭代与反迭代的技巧总结
2016/09/17 Python
Python编程实战之Oracle数据库操作示例
2017/06/21 Python
用Python实现数据的透视表的方法
2018/11/16 Python
Python第三方Window模块文件的几种安装方法
2018/11/22 Python
Python实现DDos攻击实例详解
2019/02/02 Python
Python 仅获取响应头, 不获取实体的实例
2019/08/21 Python
在keras下实现多个模型的融合方式
2020/05/23 Python
Python类成员继承重写的实现
2020/09/16 Python
卡骆驰英国官网:Crocs英国
2019/08/22 全球购物
SOKOLOV官网:俄罗斯珠宝首饰品牌
2021/01/02 全球购物
勤俭节约倡议书
2014/04/14 职场文书
售后服务承诺书模板
2014/05/21 职场文书
信用卡逾期证明示例
2014/09/13 职场文书
公司授权委托书范本
2014/09/18 职场文书
机关干部三严三实心得体会
2014/10/13 职场文书
房地产销售经理岗位职责
2015/02/02 职场文书
辞职信范文大全
2015/03/02 职场文书