如何用JavaScript加载外部文件？将点击改文本代码改为加载text.txt

没问题！要把原来点击后显示固定文本的逻辑改成加载外部text.txt的内容，咱们可以利用jQuery的AJAX能力来异步读取文件。我帮你调整了代码，还补充了加载状态和错误处理，让功能更健壮：

<!-- 页面结构 -->
<div id="div3">点击我修改文本</div>
<div id="div2">初始文本</div>

<!-- 只引入一次jQuery即可，避免重复引入导致冲突 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $("#div3").click(function() {
    changetext(); // 你原来的函数名是changtext，这里统一成更规范的changetext，也可以保留原名称
  });
});

function changetext() {
  // 先显示加载状态，提升用户体验
  document.getElementById("div2").innerHTML = "正在加载内容...";
  
  // 使用jQuery的get方法请求text.txt文件
  $.get("text.txt", function(data) {
    // 请求成功后，把文件内容赋值给div2
    document.getElementById("div2").innerHTML = data;
  }).fail(function() {
    // 请求失败时的错误提示
    document.getElementById("div2").innerHTML = "加载失败，请检查text.txt文件是否存在或路径是否正确";
  });
}
</script>

关键细节说明： #

• 移除了重复引入的jQuery库，重复引入可能导致脚本冲突或者不必要的性能消耗
• 新增了加载状态提示，避免用户点击后无反馈，误以为功能失效
• 添加了错误处理逻辑，当text.txt不存在、路径错误或者服务器出现问题时，会给出明确的提示信息
• 核心逻辑是用$.get()异步请求外部文本文件，成功后将返回的内容插入到目标div中

小提醒：如果是在本地直接打开HTML文件（file://协议），部分浏览器可能会因为跨域限制阻止读取本地文件，建议用本地服务器（比如Python的SimpleHTTPServer、XAMPP等）来运行页面。

内容的提问来源于stack exchange，提问作者user9317569