javascript - 在网页上显示来自本地 json 文件的数据

标签 javascript html json

我目前正在尝试将本地 JSON 文件 (universities.json) 中的数据显示到网页上的表格中。这是我当前的代码:

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>

</head>
<body>
    <div id="id01"></div>

<script>
var xmlhttp = new XMLHttpRequest();
var url = "universities.json";

xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var myArr = JSON.parse(this.responseText);
        myFunction(myArr);
    }
};
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i < arr.length; i++) {
        out += '<a href="' + arr[i].url + '">' + 
        arr[i].display + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}
</script>
</body>
</html>

我在这里搜索了很多问题并进行了无数次谷歌搜索,但我无法找出为什么这行不通。这只是代码的一次迭代;我也尝试过其他各种方法。我知道我没有包含表格的任何代码,但我已将其删除,直到我能够以任何格式获取数据。

任何帮助将不胜感激。谢谢

最佳答案

您的浏览器安全性不允许您发出此请求,并且您收到 CORS 错误,为了绕过此错误,您有以下两种选择。

1.更改您的浏览器安全设置。 例如,在 Chrome 中,您可以通过导航到 Chrome 安装文件夹并使用以下命令运行 chrome 来执行此操作,然后尝试在浏览器中再次测试

chrome.exe --allow-file-access-from-files

2.在本地运行网络服务器并将所有文件放在同一路径中。

关于javascript - 在网页上显示来自本地 json 文件的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53611565/

相关文章:

html - 使用 Bootstrap 为不同的屏幕设置列类

javascript - 如何检索从 jQuery 中的 servlet 发送的项目的 JSON 数组

javascript - d3js 在 map 上强制布局

javascript - 如何找到特定的模式?

javascript - 在 "onSelectedIndexChanged"上调用 jquery 函数

php - 带有 Canvas 的 Bootstrap 复选框

php - 添加超链接到 MYSQL 支持的 PHP 搜索引擎

javascript - 如何使用 angularJS 删除列表对象

javascript - Paper 工具栏 javascript 没有反应

javascript - 通过 JSON 获取 Javascript 中单个视频(非提要)的 Youtube 信息