首页前端根据text文件名读取文件显示在页面

前端根据text文件名读取文件显示在页面

时间: 2024-03-25 13:36:36 浏览: 15

您可以使用JavaScript中的XMLHttpRequest对象来读取文本文件，然后将其内容显示在页面上。以下是一个简单的例子： ```html <!DOCTYPE html> <html> <head> <title>读取文本文件</title> </head> <body> <p id="fileContent"></p> <script> // 创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); // 指定文件路径 var file = "example.txt"; // 发送请求 xhr.open("GET", file, true); xhr.send(); // 监听请求状态变化 xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { // 显示文件内容 document.getElementById("fileContent").innerHTML = xhr.responseText; } }; </script> </body> </html> ``` 在上面的例子中，我们使用XMLHttpRequest对象发送了一个GET请求，指定了要读取的文件路径。然后，我们监听了请求的状态变化，当状态变为4（即请求完成）并且状态码为200（即请求成功）时，将文件内容显示在页面上。请注意，您需要将文件路径替换为您要读取的实际文件路径。