使用浏览器控制台（Chrome）将表格数据从HTML页面导出到CSV文件

Question

我需要从网页中提取一些数据并将其存储在CSV文件中以便在Excel中打开。 我试图从浏览器控制台执行此操作，但我收到一个未定义的错误。

到目前为止，我已尝试使用此代码导出表：

function exportTableToCSV(filename) {
    var csv = [];
    var rows = document.querySelectorAll("table 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);
}

当我定义这个函数并运行它时，我得到一个“downloadCSV not defined error”。 除了显而易见的内容之外，Chrome中的内置浏览器控制台是否有任何限制？

此代码也需要在循环中运行，因为有多个页面都有表，但将它们全部放在一个CSV文件中会很不错。 对于初学者来说，它应该只是提取表中可以找到的任何内容。 当我开始工作时，我会潜入并提取我需要的特定字段。

编辑：

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

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

  downloadLink = document.createElement("a");
  downloadLink.download = filename;
  downloadLink.href = window.URL.createObjectURL(csvFile);

  downloadLink.style.display = "none";

  document.body.appendChild(downloadLink);

  downloadLink.click();
}

Answer 1

你可以做的是，不是为每个表创建一个csv，而是将所有数据从页面保存到某个存储，例如本地存储：

$(document).ready(function() {
    $(window).unload(saveSettings);
    loadlist();
});

function loadlist() {
    savedlist = localStorage.list;
}

function savelist() {
    localStorage.list = savedlist + currentlist;
}

而不是立即下载csv，使用上面的示例收集存储中的所有数据（您需要根据需要进行调整）。 然后，一旦获得所有数据，将其放入单个csv然后下载。 然后，从存储中删除数据：

function deletelist() {
    localStorage.removeItem(list);
}

本地存储在您的页面中保持来自同一域，直到您清除或用户手动删除其浏览器数据为止。