<html>
<head>
<!-- <p style="font-size: 20px;color: red;">使用a标签方式将json导出csv文件</p> -->
<!-- <button onclick='tableToExcel()'>导出</button> -->
</head>
<body>
<div id="ss"><a id="dc" href="">导出</a></div>
<table id="table">
</table>
<script>
//要导出的json数据
var jsonData = [{
name: '张三',
phone: '123456789',
email: '000@123456.com'
},
{
name: '李四',
phone: '123456789',
email: '000@123456.com'
},
{
name: 'aa',
phone: '123456789',
email: '000@123456.com'
},
{
name: 'bb',
phone: '123456789',
email: '000@123456.com'
},
];
var html = "<tr><td>姓名</td><td>手机号</td><td>邮箱</td></tr>";
for(var i = 0; i < jsonData.length; i++){
html += '<tr><td>'+jsonData[i]["name"]+'</td><td>'+jsonData[i]["phone"]+'</td><td>'+jsonData[i]["email"]+'</td><tr>'
}
document.getElementById("table").innerHTML = html;
document.getElementById("ss").onclick = function() {
var a = '姓名,手机号,邮箱\n';
daochu("dc", a, '表格导出', jsonData)
};
function daochu(id, tabletitle, tablename, data) {
let str = tabletitle;
for (let i = 0; i < data.length; i++) {
for (let item in data[i]) {
str += `${data[i][item] + '\t'},`;
}
str += '\n';
}
let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
var link = document.getElementById(id);
link.href = uri;
link.download = tablename + ".csv";
}
</script>
</body>
</html>
