Question

我需要使用JS将HTML表转换为csv，但为此，我需要将JS脚本置于外部（包含在另一个html页面中，而不是包含在该表中的html页面中）。为此，我在线找到了一个脚本，可以完美地转换所有内容，但是它是内部的（它需要包含在表的页面中，因为它使用的是document.querySelectorAll（）），所以我需要将其设置为外部。

我尝试使用FileReader api读取html页面，然后使用DOMParser（）将其解析为字符串，但是它不起作用，我在尝试时收到错误消息“无法读取未定义的属性'querySelectorAll'”将新的PArsed对象用作Document对象。

var doc;
var selectedFile;
//function that reads the html file and parses it

function onFileChosen(fileEvent) {
  var selectedFile = fileEvent.target.files[0];
  var reader = new FileReader();
  reader.onload = function(event) {
    var fileContent = event.target.result;

  var domparser = new DOMParser();
  doc = domparser.parseFromString(selectedFile, "text/html");
  }
  reader.readAsText(selectedFile);

};

//function that exports the csv, where the error occurs  

function exportTableToCSV(filename) {
  var csv = [];
  //the line bellow is the error
  var rows = doc.querySelectorAll("table tr");

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

    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);
}


    //the calls
    <body>
            <input type="file" (change)="onFileChosen($event)">   
            <div>
                    <button 
    onclick="exportTableToCSV('members.csv')">Export HTML Table To CSV 
    File</button>
            </div>

如何读取HTML文件并将其另存为变量，然后将其用作JavaScript的Document对象？

0 个答案: