We can use method readAsBinaryString or readAsText to read file.
Example 1: readAsBinaryString
<html>
<body>
<h1>FileReader readAsBinaryString demo</h1>
<input type="file" id="myFile">
<hr>
<textarea style="width:600px;height: 300px" id="output"></textarea>
<script>
var input = document.getElementById("myFile");
var output = document.getElementById("output");
input.addEventListener("change", function() {
if (this.files && this.files[0]) {
var myFile = this.files[0];
var reader = new FileReader();
reader.addEventListener('load', function(e) {
output.innerText = e.target.result.substring(0, 200);
console.log(reader.result)
});
reader.readAsBinaryString(myFile);
}
});
</script>
</body>
</html>
Online demo: http://demo.tutorialspots.com/FileReader/readAsBinaryString.html
Example 2: readAsText
<html>
<head>
<script>
var readAsText = function(event) {
var input = event.target;
var output = document.getElementById('output');
var reader = new FileReader();
reader.onload = function() {
var text = reader.result;
output.innerText = text.substring(0, 200);
};
reader.readAsText(input.files[0]);
};
</script>
</head>
<body>
<h1>FileReader readAsText demo</h1>
<input type='file' onchange='readAsText(event)'><br>
<div id='output'></div>
</body>
</html>
Demo online: http://demo.tutorialspots.com/FileReader/readAsText.html
