通过js导出json到表格

最新推荐文章于 2023-11-16 22:58:16 发布

你倒是告诉我错在哪

最新推荐文章于 2023-11-16 22:58:16 发布

阅读量260

点赞数

文章标签： javascript json 前端

本文链接：https://blog.csdn.net/qq_45163801/article/details/120987760

版权

通过js导出json到表格

<!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>Document</title>
</head>

<body>
    <button onclick="down()">导出表格</button>
</body>

</html>
<script>
    let data = {
        "welcome": '欢迎光临',
        "cancel": '取消',
    }
    function down() {
        JSONToExcelConvertor(data, "表格名")
    }
    function JSONToExcelConvertor(JSONData, FileName) {
        //先转化json
        var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
        var excel = '<table>';
        var row = "<tr>";
        //设置表头
        var keys = ["key", "zh"];
        keys.forEach(function (item) {
            row += "<td>" + item + '</td>';
        });
        //换行
        excel += row + "</tr>";
        //设置数据
        for (const key in arrData) {
            var row = "<tr>";
            row += '<td>' + key + '</td>';
            row += '<td>' + arrData[key] + '</td>';
            excel += row + "</tr>";
        }
        excel += "</table>";

        var excelFile = "<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'>";
        excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';
        excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';
        excelFile += '; charset=UTF-8">';
        excelFile += "<head>";
        excelFile += "<!--[if gte mso 9]>";
        excelFile += "<xml>";
        excelFile += "<x:ExcelWorkbook>";
        excelFile += "<x:ExcelWorksheets>";
        excelFile += "<x:ExcelWorksheet>";
        excelFile += "<x:Name>";
        excelFile += "{worksheet}";
        excelFile += "</x:Name>";
        excelFile += "<x:WorksheetOptions>";
        excelFile += "<x:DisplayGridlines/>";
        excelFile += "</x:WorksheetOptions>";
        excelFile += "</x:ExcelWorksheet>";
        excelFile += "</x:ExcelWorksheets>";
        excelFile += "</x:ExcelWorkbook>";
        excelFile += "</xml>";
        excelFile += "<![endif]-->";
        excelFile += "</head>";
        excelFile += "<body>";
        excelFile += excel;
        excelFile += "</body>";
        excelFile += "</html>";

        var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);

        var link = document.createElement("a");
        link.href = uri;

        link.style = "visibility:hidden";
        link.download = FileName + ".xls";

        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }

</script>

你倒是告诉我错在哪

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
通过js导出json到表格

通过js导出json到表格<!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"> &
复制链接

扫一扫