- 首先需要在HTML文件中引入jQuery库，可以在head标签内添加如下代码：
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> - 在html文件中添加一个显示文本的区域，例如：
<div id="textArea"></div>- 在JavaScript文件中编写ajax代码，读取txt文件内容并将其显示在文本区域中：
$(document).ready(function() {
$.ajax({
url: "test.txt",
dataType: "text",
success: function(data) {
$("#textArea").html(data);
}
});
});其中，url属性代表要读取的txt文件路径，dataType属性表示文件类型为文本，success属性表示文件读取成功后的回调函数，其中将文件内容赋值给文本区域的HTML属性。
- 将JavaScript文件引入HTML文件中，例如：
<script src="demo.js"></script>- 在本地开启一个静态服务器，将HTML文件和txt文件放在同一个目录下，通过访问本地服务器的地址，即可查看ajax读取txt文件的效果。
通过ajax读取txt文件的方法如下：
- 准备txt文件并上传至服务器，假设文件路径为http://www.example.com/file.txt。
- 在HTML代码中添加一个空的div元素，用于接收读取到的文本内容：
<div id="content"></div>- 使用jQuery库调用ajax方法读取txt文件内容：
$.ajax({
url: "http://www.example.com/file.txt",
success: function(result) {
$("#content").text(result);
}
});其中，success回调函数用于处理读取成功后的响应结果，将结果写入之前准备好的div元素中。
完整的示例代码如下：
<!DOCTYPE html>
<html>
<head>
<title>读取txt文件</title>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<div id="content"></div>
<script>
$.ajax({
url: "http://www.example.com/file.txt",
success: function(result) {
$("#content").text(result);
}
});
</script>
</body>
</html>发布者：luotuoemo，转转请注明出处：https://www.jintuiyun.com/115491.html
