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

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

266491 次浏览

Without jQuery:

const $output = document.getElementById('output')
document.getElementById('file').onchange = function() {
var file = this.files[0];


var reader = new FileReader();
reader.onload = function(progressEvent) {
// Entire file
const text = this.result;
$output.innerText = text


// By lines
var lines = text.split('\n');
for (var line = 0; line < lines.length; line++) {
console.log(lines[line]);
}
};
reader.readAsText(file);
};
<input type="file" name="file" id="file">
<div id='output'>
...
</div>

Remember to put your javascript code after the file field is rendered.

Using ES6 the javascript becomes a little cleaner

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