• 前端通过csv导出excel表格demo


    敬上代码

    <html>
    <head>
    <p style="font-size: 20px;color: red;">使用a标签方式将json导出csv文件</p>
    <button onclick='tableToExcel()'>导出</button>
    </head>
    <body>
    <script>
    
    function tableToExcel(){
    //要导出的json数据
    var jsonData = [
    {
    name:'路人甲',
    phone:'123456789',
    email:'000@123456.com'
    },
    {
    name:'炮灰乙',
    phone:'123456789',
    email:'000@123456.com'
    },
    {
    name:'土匪丙',
    phone:'123456789',
    email:'000@123456.com'
    },
    {
    name:'流氓丁',
    phone:'123456789',
    email:'000@123456.com'
    },
    ]
    //列标题,逗号隔开,每一个逗号就是隔开一个单元格
    let str = `姓名,电话,邮箱
    `;
    //增加	为了不让表格显示科学计数法或者其他格式
    for(let i = 0 ; i < jsonData.length ; i++ ){
    for(let item in jsonData[i]){
    str+=`${jsonData[i][item] + '	'},`; 
    }
    str+='
    ';
    }
    //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>
    </body>
    </html>
  • 相关阅读:
    如何使用设计模式系列
    网站性能越来越差怎么办
    ASP.NET特殊字符串替换函数
    SQL Server多事务并发问题
    弹出隐藏子菜单
    过滤sql匹配符号 防止sql注入
    统一建模语言UML轻松入门系列
    sql 字符处理函数大全
    并发控制
    类与类之间的关系图
  • 原文地址:https://www.cnblogs.com/zhou195/p/10106547.html
Copyright © 2020-2023  润新知