在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]);
        }
    );

Answer 2

我们可以使用以下代码来实现此目的：

<iframe src="http://dev.imaginestudios.cu.cc/test.txt"></iframe> 

Example

参考：Display text file in HTML