javascript - 无法使用 XMLHttpRequest() 检索数据

Question

我的目标是创建一个 JavaScript 程序，该程序使用 XMLHttpRequest 对象从 HTML 文件中检索信息并将响应显示给用户，而无需重新加载页面。

单击按钮后，应显示数据。

问题是我的代码无法访问 HTML 文件中的数据。JS文件和HTML文件也放在同一个文件夹中，我该如何解决？

JS代码：

//button to get data
var btnGet = document.querySelector("#btnGetData");
btnGet.addEventListener('click', getData);

//Create getData function
function getData(){
    //Create XMLHttpRequest object
    var xhttp = new XMLHttpRequest();
    
    //onreadystatechange
    xhttp.onreadystatechange = function(){
    if(this.readyState == 4 && this.status == 200){
        document.getElementById("content").innerHTML = this.responseText;
        alert("did it");
    }else{
        alert("error");
    }
};
    //Create the request
    xhttp.open("GET", "data.html", true);
    
    //Send the resuest
    xhttp.send();
}

从浏览器收到错误：

标签： javascriptxmlhttprequest

Answer 1

JavaScript 无法读取客户端文件系统上的本地文件。仅当文件存储在服务器上时才有效。