原生js导出json为excel的三种方式

通过table标签转换excel

    
    
    
    


    
    

        
        
学生成绩表
        

            
            
编号
            
学号
            
姓名
            
性别
            
年龄
            
成绩
        
        

            
语文
            
数学
            
英语
        
        

            
1
            
2016001
            
张三
            
男
            
13
            
85
            
94
            
77
        
        

            
2
            
2016002
            
李四
            
女
            
12
            
96
            
84
            
89
        
    
 
    导出表格
 
    

导出json到excel

采用拼接table的HTML代码方式
参考博客：https://www.jianshu.com/p/6532c566dda6
找到了一个别人封装的组件
exportExcel.js

function exportExcel(JSONData, FileName, title, filter) {
    if (!JSONData) return;
    //转化json为object
    var arrData = typeof JSONData != "object" ? JSON.parse(JSONData) : JSONData;
    var excel = "";
    //设置表头
    var row = "";
    if (title) { //使用标题项
      for (var i in title) {
        row += "";
      }
    } else {//不使用标题项
      for (var i in arrData[0]) {
        row += "";
      }
    }
    excel += row + "";
    //设置数据
    for (var i = 0; i < arrData.length; i++) {
      var row = "";
      for (var index in arrData[i]) {
        //判断是否有过滤行
        if (filter) {
          if (filter.indexOf(index) == -1) {
            var value = arrData[i][index] == null ? "" : arrData[i][index];
            row += "";
          }
        } else {
          var value = arrData[i][index] == null ? "" : arrData[i][index];
          row += "";
        }
      }
      excel += row + "";
    }
    excel += "
" + title[i] + "
" + i + "
" + value + "
" + value + "
";
    var excelFile =
      "";
    excelFile +=
      '';
    excelFile +=
      '';
    excelFile += "";
    excelFile += "";
    excelFile += "";
    excelFile += "";
    excelFile += excel;
    excelFile += "";
    excelFile += "";
    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);
}

使用封装函数生成excel

导出csv文件

参考博客：https://blog.csdn.net/hhzzcc_/article/details/80419396

function tableToExcel(){
    const jsonData = [
        {
            name:'路人甲',
            phone:'123456',
            email:'[email protected]'
        },
        {
            name:'炮灰乙',
            phone:'123456',
            email:'[email protected]'
        },
        {
            name:'土匪丙',
            phone:'123456',
            email:'[email protected]'
        },
        {
            name:'流氓丁',
            phone:'123456',
            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.download =  "json数据表.csv";
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}