[javascript] 자바스크립트로 파일 내용 읽어오기

자바스크립트로 파일내용을 읽어 올 수 있다.

 

1. body에 input태그를 추가시킨다.

    <input type="file" id="file">
    <div id="encoding"></div>
    <textarea id="result" rows="5" cols="80"></textarea>

 

2. 스크립트 코드

<script>
    window.onload = function(){
        function onFileSelect(event) {
            var file = event.target.files[0];
            console.log(file);
          
            var reader = new FileReader();
            reader.onload = function(e) {
              document.getElementById('result').value = reader.result;
            };
          
            reader.readAsText(file);
          }
          
          document.getElementById('file').addEventListener('change', onFileSelect, false);
    }
</script>

파일을 선택하면 textarea에 파일의 내용이 들어간다.