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 相关文章推荐
jquery 实现input输入什么div图层显示什么
Jun 15 Javascript
Node.js模块加载详解
Aug 16 Javascript
bootstrap输入框组代码分享
Jun 07 Javascript
Node.js中防止错误导致的进程阻塞的方法
Aug 11 Javascript
js生成随机颜色方法代码分享(三种)
Dec 29 Javascript
angular实现表单验证及提交功能
Feb 01 Javascript
关于javascript作用域的常见面试题分享
Jun 18 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
Feb 09 Javascript
微信小程序定义和调用全局变量globalData的实现
Nov 01 Javascript
原生js+css调节音量滑块
Jan 15 Javascript
基于html+css+js实现简易计算器代码实例
Feb 28 Javascript
Vue实现随机验证码功能
Dec 29 Vue.js
微信小程序 表单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
递归删除一个节点以及该节点下的所有节点示例
2014/03/19 PHP
PHP中iconv函数转码时截断字符问题的解决方法
2015/01/21 PHP
PHP数组函数array_multisort()用法实例分析
2016/04/02 PHP
针对多用户实现头像上传功能PHP代码 适用于登陆页面制作
2016/08/17 PHP
PHP+Ajax实现的检测用户名功能简单示例
2019/02/12 PHP
php利用array_search与array_column实现二维数组查找
2019/07/08 PHP
OfflineSave离线保存代码再次发布使用说明
2007/05/23 Javascript
js 浮动层菜单收藏
2009/01/16 Javascript
js 幻灯片的实现
2011/12/06 Javascript
js中判断数字\字母\中文的正则表达式 (实例)
2012/06/29 Javascript
javascript获取所有同类checkbox选项(实例代码)
2013/11/07 Javascript
JavaScrip实现PHP print_r的数功能(三种方法)
2013/11/12 Javascript
js 金额格式化来回转换示例
2014/02/23 Javascript
JS获取时间的方法
2015/01/21 Javascript
浅析javascript中函数声明和函数表达式的区别
2015/02/15 Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
2016/10/27 Javascript
Nodejs下DNS缓存问题浅析
2016/11/16 NodeJs
angularJS开发注意事项
2018/05/26 Javascript
Python 正则表达式操作指南
2009/05/04 Python
python创建线程示例
2014/05/06 Python
Python使用Beautiful Soup包编写爬虫时的一些关键点
2016/01/20 Python
Python实现列表转换成字典数据结构的方法
2016/03/11 Python
Python Numpy库安装与基本操作示例
2019/01/08 Python
对Python 多线程统计所有csv文件的行数方法详解
2019/02/12 Python
mac系统下Redis安装和使用步骤详解
2019/07/09 Python
python 基于dlib库的人脸检测的实现
2019/11/08 Python
Python发送手机动态验证码代码实例
2020/02/28 Python
倩碧美国官网:Clinique美国
2016/07/20 全球购物
印度购买眼镜和太阳镜网站:Coolwinks
2018/09/26 全球购物
垃圾回收的优点和原理
2014/05/16 面试题
旅游项目开发策划书
2014/01/18 职场文书
高中生的自我鉴定范文
2014/01/24 职场文书
红色电影观后感
2015/06/18 职场文书
Python生成九宫格图片的示例代码
2021/04/14 Python
php修改word的实例方法
2021/11/17 PHP
golang用type-switch判断interface的实际存储类型
2022/04/14 Golang