表格导出excel
如果在主流浏览器上,不考虑ie,可以这么写
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1" cellspacing=" 0" id="tableExcel" width="100%" class="table table-hover">
<tr>
<td colspan="5" align="center">html 表格导出Excel</td>
</tr>
<tr>
<td>列标题1</td>
<td>列标题2</td>
<td>类标题3</td>
<td>列标题4</td>
<td>列标题5</td>
</tr>
<tr>
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td>ddd</td>
<td>eee</td>
</tr>
<tr>
<td>AAA</td>
<td>BBB</td>
<td>CCC</td>
<td>DDD</td>
<td>EEE</td>
</tr>
<tr>
<td>FFF</td>
<td>GGG</td>
<td>HHH</td>
<td>III</td>
<td>JJJ</td>
</tr>
</table>
<a id="dlink" style="display:none;"></a>
<input type="text" name="" value="请输入文件名" class="center-block form-control"
style="margin-bottom: 20px; text-align: center" id="submit" onclick="submt()">
<input type="button" class="btn btn-primary center-block"
onclick="tableToExcel('tablename', 'name', 'zhangsan.xls')" value="导出">
</body>
<script>
function submt() {
document.getElementById('submit').value = "";
}
var tableToExcel = (function () {
var uri = 'data:application/vnd.ms-excel;base64,'
, 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><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
, 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("tableExcel")
var ctx = {
worksheet: name || 'Worksheet', table: table.innerHTML }
document.getElementById("dlink").href = uri + base64(format(template, ctx));
document.getElementById("dlink").download = document.getElementById('submit').value + '.xls';
document.getElementById("dlink").click();
}
})();
</script>
</html>
如果要兼容ie浏览器
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 method5(tableid) {
if (getExplorer() == 'ie') {
var curTbl = document.getElementById(tableid);
var oXL = new ActiveXObject("Excel.Application");
var oWB = oXL.Workbooks.Add();
var xlsheet = oWB.Worksheets(1);
var sel = document.body.createTextRange();
sel.moveToElementText(curTbl);
sel.select();
sel.execCommand("Copy");
xlsheet.Paste();
oXL.Visible = true;
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);
oXL.Quit();
oXL = null;
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 = '<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><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>' ,
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));
}
})();
method5(table); //table是表格的id
JSON数据导出excel
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script>
function tableToExcel() {
//要导出的json数据
const jsonData = [
{
name: '张先生',
phone: '123456789',
email: '[email protected]'
},
{
name: '王先生',
phone: '123456789',
email: '[email protected]'
},
{
name: '李先生',
phone: '123456789',
email: '[email protected]'
},
{
name: '赵先生',
phone: '123456789',
email: '[email protected]'
},
]
//列标题,逗号隔开,每一个逗号就是隔开一个单元格
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标签实现
let link = document.createElement("a");
link.href = uri;
link.innerHTML = 'json数据表.csv下载';
//对下载的文件命名
link.download = "json数据表.csv";
document.body.appendChild(link);
}
tableToExcel();
</script>
</html>