當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

js读取txt文件中的内容

發布時間：2023/12/9 编程问答 25 豆豆

生活随笔收集整理的這篇文章主要介紹了 js读取txt文件中的内容小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

拿到file文件對象之后

1）新建一個fileReader

var reader = new FileReader();

2）執行讀文件的函數，設置編碼格式

reader.readAsText(file, "UTF-8");

3）讀取文件中的內容

reader.onload = function (e) {const val = e.target.result; }

注：在回調函數中使用讀取的數據

下面直接寫一個例子：實現了讀取多個文件并展示文件的內容

<!DOCTYPE html> <html lang="zh"><head><meta charset="UTF-8" /><title>FileReader</title> </head><body><div><input type="file" name="file" multiple="multiple" id="files" onchange="choosefile()" /><div id="name"></div><textarea id="text" cols="100" rows="50"></textarea></div><script type="text/javascript">function choosefile () {var fileList = document.getElementById('files').files;var nameStr = '';for (var i = 0; i < fileList.length; i++) {nameStr += `${i === 0 ? '' : ', '}${fileList[i].name}`;var reader = new FileReader();reader.readAsText(fileList[i], "UTF-8");reader.onload = function (e) {var content = e.target.result;console.log(content);const textAreaVal = document.getElementById('text').value;document.getElementById('text').value = textAreaVal + content;}}document.getElementById('name').append(nameStr);}</script> </body></html>

總結

以上是生活随笔為你收集整理的js读取txt文件中的内容的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。