时间戳

首页 > 解决方案 > JavaScript CSV 导出 - 在每个值之后添加选项卡

javascript - JavaScript CSV 导出 - 在每个值之后添加选项卡

问题描述

这仅在 Chrome 中发生，并且仅在更新到版本 70.0.3538.77 后才开始发生。在更新之前，这在 Chrome 中从未发生过。

我有一些 JavaScript 在单击按钮以将表导出到 .csv 文件时被激活。

文件中的每个单元格在值之后都有一个制表符（或者可能是换行符？）。有人知道这里可能会发生什么吗？

这是要导出的代码：

function downloadCSV(csv, filename) {
    var csvFile;
    var downloadLink;

    // CSV file
    csvFile = new Blob([csv], {type: "text/csv"});

    // Download link
    downloadLink = document.createElement("a");

    // File name
    downloadLink.download = filename;

    // Create a link to the file
    downloadLink.href = window.URL.createObjectURL(csvFile);

    // Hide download link
    downloadLink.style.display = "none";

    // Add the link to DOM
    document.body.appendChild(downloadLink);

    // Click download link
    downloadLink.click();
}

function exportTableToCSV(filename) {
    var csv = [];
    var rows = document.querySelectorAll("table tbody tr,table thead tr");

    for (var i = 0; i < rows.length; i++) {
        var row = [], cols = rows[i].querySelectorAll("td,th");

        for (var j = 0; j < cols.length; j++) 
            row.push(cols[j].innerText);

        csv.push(row.join(","));        
    }

    // Download CSV file
    downloadCSV(csv.join("\n"), filename+(new Date().getTime())+".csv");
}

标签： javascript

解决方案

一个简单的解决方法是修剪单元格的值：

row.push(cols[j].innerText.trim());

trim()从值中删除所有前导或尾随行结尾、制表符、空格等。

您可能还需要考虑使用引号限定文本，以防止单元格值中出现逗号问题：

row.push('"' + cols[j].innerText.trim() + '"');

肯定有更复杂的情况（如果您的值现在包含引号怎么办？），因此您可能需要随着时间的推移在此基础上输出正确的 CSV 文件。

推荐阅读