a标签download属性下载excel

最新推荐文章于 2024-07-23 20:33:37 发布

落花www

最新推荐文章于 2024-07-23 20:33:37 发布

阅读量781

点赞数

文章标签： html excel javascript css

本文链接：https://blog.csdn.net/wxq981795514/article/details/121911744

版权

前端开发 Excel 数据转换下载 JavaScript

关键词由CSDN通过智能技术生成

在后端只给数据的情况下，前端根据数据列表生成excel并下载

function tableToExcel(data){
        // 利用table制作excel的表头
        let str = '<tr><td>姓名</td><td>手机号</td></tr>';
        // 循环遍历数据，每行加入tr标签，每个单元格加td标签，data为数据接口返回的数据列表
        for (let i = 0 ; i < data.length ; i++ ) {
            str += '<tr>';
            for (let item in data[i]) {
                //增加\t为了不让表格显示科学计数法或者其他格式
                str += `<td>${ data[i][item] + '\t'}</td>`;
            }
            str += '</tr>';
        }

        let uri = 'data:application/vnd.ms-excel;base64,';

        // 下载的表格模板数据
        let 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:Name>${文档标题}</x:Name>
        <x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>
        </x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->
        </head><body><table>${str}</table></body></html>`;

        // 下载模板
        $('#downloadBtn').attr('href', uri + base64(template));
        $('#downloadBtn').attr('download', 文档名称);
        // window.location.href = uri + base64(template);
    }

    // 输出base64编码
    function base64 (s) {
        return window.btoa(unescape(encodeURIComponent(s)));
    }