javascript - 在 JavaScript 中显示文本文件

Question

我应该使用什么代码来在 JavaScript 中显示纯文本 .txt 文件的内容？我希望文本在事件窗口的屏幕上滚动。

提前致谢!

Answer 1

要让文本显示换行等，请使用 <pre>或 <textarea> ，即

<pre id="contents"></pre>

接下来就是，纯文本文件在哪里？

来自服务器

使用XMLHttpRequest

function populatePre(url) {
    var xhr = new XMLHttpRequest();
    xhr.onload = function () {
        document.getElementById('contents').textContent = this.responseText;
    };
    xhr.open('GET', url);
    xhr.send();
}
populatePre('path/to/file.txt');

从本地机器

让用户使用 <input type="file" /> 选择文件

<input type="file" id="filechoice" />

然后当用户选择一个文件时，使用FileReader填充 <pre>

document
    .getElementById('filechoice')
    .addEventListener(
        'change',
        function () {
            var fr = new FileReader();
            fr.onload = function () {
                document.getElementById('contents').textContent = this.result;
            };
            fr.readAsText(this.files[0]);
        }
    );