JS HTML
HOW TO READ FILES IN JAVASCRIPT
SIMPLE READ TEXT FILE (A)
01
EMPTY DIV & FILE PICKER <div id="show"></div> <input type="file" value="Pick" id="pick" accept="text/plain" onchange="readFile()"/>
SIMPLE READ TEXT FILE (B)
02
function readFile() { GET SELECTED FILE let sFile = document.getElementById ("pick").files[0];
READ SELECTED FILE let reader = new FileReader(); reader.addEventListener("loadend", () => { document.getElementById ("show").innerHTML = reader.result; }); reader.readAsText(sFile); }
SIMPLE READ IMAGE FILE (A)
03
EMPTY IMG & FILE PICKER <img id="show"/> <input type="file" value="Pick" id="pick" accept="image/*" onchange="readFile()"/>
SIMPLE READ IMAGE FILE (B)
04
function readFile() { GET SELECTED FILE let sFile = document.getElementById ("pick").files[0];
READ SELECTED FILE let reader = new FileReader(); reader.addEventListener("load", () => { document.getElementById("show") .src = reader.result; }); reader.readAsDataURL(selected); }