如何使用Javascript读取本地文本文件并逐行读取?

IT技术 javascript html file
2021-02-01 06:50:39

我有一个由 html+javascript 制作的网页,这是演示,我想知道如何读取本地 csv 文件并逐行读取,以便我可以从 csv 文件中提取数据。

2个回答

没有 jQuery:

document.getElementById('file').onchange = function(){

  var file = this.files[0];

  var reader = new FileReader();
  reader.onload = function(progressEvent){
    // Entire file
    console.log(this.result);

    // By lines
    var lines = this.result.split('\n');
    for(var line = 0; line < lines.length; line++){
      console.log(lines[line]);
    }
  };
  reader.readAsText(file);
};

HTML:

<input type="file" name="file" id="file">

请记住在呈现文件字段之后放置您的 javascript 代码。

@gsamaras 我不记得了,但我使用了一些流,它逐个读取数据,然后每次遇到\n. 但是对于 100m 行,您将遇到以 HTML 显示它们的表格。
2021-03-15 06:50:39
此外,如果返回(换行)在带引号的字段内,则此解决方案无法处理。至于 Tomas,如果您有更高级的浏览器,则可以使用生成器逐行读取,而无需进行“拆分”。
2021-03-23 06:50:39
我有 200000 行(不是开玩笑,这是一个日志文件)。我不认为你的解决方案涵盖了这一点,但很好的尝试。
2021-03-25 06:50:39
@TomášZato 我的矿是 100m 线。不过,我还没有测试过那个答案......你是如何处理的?一个例子的链接会非常感激!huanPastas,+1 为答案!
2021-04-09 06:50:39
我们在其中取行的外部文件的路径在哪里?
2021-04-11 06:50:39

使用 ES6,javascript 变得更简洁

handleFiles(input) {

    const file = input.target.files[0];
    const reader = new FileReader();

    reader.onload = (event) => {
        const file = event.target.result;
        const allLines = file.split(/\r\n|\n/);
        // Reading line by line
        allLines.forEach((line) => {
            console.log(line);
        });
    };

    reader.onerror = (event) => {
        alert(event.target.error.name);
    };

    reader.readAsText(file);
}
使用正则表达式投票支持分割线,这是正确的做法。
2021-03-18 06:50:39
很好的例子,我喜欢处理 Windows 和 Unix 风格的行尾。谢谢你。
2021-03-20 06:50:39
更简单的正则表达式: \r?\n
2021-03-24 06:50:39