使用js下载数据
由于项目中会用到一个文件的下载功能,所以查找了各种论坛,找到两篇很好用的下载方式,1.通过获取json数据下载为csv文件2.将Table表格下载为excel文件。
代码来源(代码全部来源于以下两篇博客)
https://blog.csdn.net/u012832088/article/details/78905052?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-14.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-14.control
https://blog.csdn.net/qq_38951418/article/details/88057016
获取json数据下载为csv文件
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
head>
<body>
<button onclick='tableToExcel()'>导出button>
body>
html>
<script>
function tableToExcel(){
//要导出的json数据
var jsonData = [
{
name:'李四',
phone:'1777829****',
email:'20838****@qq.com'
},
{
name:'张三',
phone:'1777829****',
email:'20838****@qq.com'
},
{
name:'王五',
phone:'1777829****',
email:'20838****@qq.com'
},
{
name:'老刘',
phone:'1777829****',
email:'20838****@qq.com'
}
]
//列标题,逗号隔开,每一个逗号就是隔开一个单元格
let str = `姓名,电话,邮箱\n`;
//增加\t为了不让表格显示科学计数法或者其他格式
for(let i = 0 ; i < jsonData.length ; i++ ){
for(let item in jsonData[i]){
str+=`${jsonData[i][item] + '\t'},`;
}
str+='\n';
}
//encodeURIComponent解决中文乱码
let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
//通过创建a标签实现
var link = document.createElement("a");
link.href = uri;
//对下载的文件命名
link.download = "json数据表.csv";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
script>
将Table数据下载为Excel表格
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Table2Exceltitle>
<script type="text/javascript" src="table2excel.js">script>
head>
<body>
<table id="tableid" border="1">
<tr><td>你好td><td>12td><td>12td><td>12td><td>12td>tr>
<tr><td>你td><td>12td><td>12td><td>12td><td>12td>tr>
<tr><td>12td><td>12td><td>12td><td>12td><td>12td>tr>
<tr><td>12td><td>12td><td>12td><td>12td><td>12td>tr>
<tr><td>12td><td>12td><td>12td><td>12td><td>12td>tr>
<tr><td>12td><td>12td><td>12td><td>12td><td>12td>tr>
table>
<button onclick="toexcel()">下载Excelbutton>
<script type="text/javascript">
var tableId = document.getElementById('tableid');
function toexcel() {
methodtable2excel(tableId);
}
/* Table 生成 Excel */
var idTmr;
function getExplorer() {
var explorer = window.navigator.userAgent ;
//ie
if (explorer.indexOf("MSIE") >= 0) {
return 'ie';
}
//firefox
else if (explorer.indexOf("Firefox") >= 0) {
return 'Firefox';
}
//Chrome
else if(explorer.indexOf("Chrome") >= 0){
return 'Chrome';
}
//Opera
else if(explorer.indexOf("Opera") >= 0){
return 'Opera';
}
//Safari
else if(explorer.indexOf("Safari") >= 0){
return 'Safari';
}
}
function methodtable2excel(tableid) {//整个表格拷贝到EXCEL中
if(getExplorer()=='ie')
{
var curTbl = document.getElementById(tableid);
var oXL = new ActiveXObject("Excel.Application");//创建AX对象excel
var oWB = oXL.Workbooks.Add();//获取workbook对象
var xlsheet = oWB.Worksheets(1);//激活当前sheet
var sel = document.body.createTextRange();
sel.moveToElementText(curTbl);//把表格中的内容移到TextRange中
sel.select();//全选TextRange中内容
sel.execCommand("Copy");//复制TextRange中内容
xlsheet.Paste();//粘贴到活动的EXCEL中
oXL.Visible = true;//设置excel可见属性
try {
var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");
} catch (e) {
print("Nested catch caught " + e);
} finally {
oWB.SaveAs(fname);
oWB.Close(savechanges = false);
//xls.visible = false;
oXL.Quit();
oXL = null;
//结束excel进程,退出完成
//window.setInterval("Cleanup();",1);
idTmr = window.setInterval("Cleanup();", 1);
}
}
else
{
tableToExcel(tableid);
}
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '{table}
',
base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) },
format = function(s, c) {
return s.replace(/{(\w+)}/g,
function(m, p) { return c[p]; }) };
return function(table, name) {
if (!table.nodeType) table = document.getElementById(table);
var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML};
window.location.href = uri + base64(format(template, ctx))
}
})();
script>
body>
html>