可以使用XMLHttpRequest(直接方法)和FileReader(间接方法)两种方式读取TXT文件内容：直接方法：使用XMLHttpRequest发送HTTP GET请求，指定响应类型为文本，监听响应并读取文件内容。间接方法：使用FileReader监听文件选择事件，读取文件并将其内容存储在result属性中。
如何使用 HTML 读取 TXT 文件内容
直接方法：使用 XMLHttpRequest
HTML 中读取 TXT 文件内容的最直接方法是使用 XMLHttpRequest 对象。该对象允许向服务器发送异步 HTTP 请求并接收响应。
<code>// 创建一个 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
// 打开一个 GET 请求
xhr.open("GET", "/path/to/file.txt");
// 指定响应类型为文本
xhr.responseType = "text";
// 监听服务器响应
xhr.onload = function() {
if (xhr.status === 200) {
// 读取文件内容
var content = xhr.responseText;
// 使用内容...
}
};
// 发送请求
xhr.send();</code>间接方法：使用 FileReader
立即学习“前端免费学习笔记（深入）”；
如果您希望在本地读取 TXT 文件，可以使用 FileReader 对象。该对象允许读取文件和数据 URI。
<code>// 获取文件元素
var fileInput = document.getElementById("file-input");
// 监听文件选择事件
fileInput.addEventListener("change", function() {
// 获取文件
var file = fileInput.files[0];
// 创建一个 FileReader 对象
var reader = new FileReader();
// 监听加载事件
reader.onload = function() {
// 读取文件内容
var content = reader.result;
// 使用内容...
};
// 开始读取文件
reader.readAsText(file);
});</code>以上就是html怎么读取txt内容的详细内容，更多请关注php中文网其它相关文章！
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
622
收藏
