我已经在我的本地系统中保存了一个JSON文件，并创建了一个JavaScript文件，以便读取JSON文件并打印数据。以下是JSON文件:
{"resource":"A","literals":["B","C","D"]}
假设这是JSON文件的路径:/Users/Documents/workspace/test.json。
谁能帮我写一段简单的代码来读取JSON文件并用JavaScript打印数据?
当前回答
您可以使用fetch()在async await的帮助下完成此操作。这是从url获取数据的最新和最安全的方式。
const url = "../asset/videoData.json";
const fetchJson = async () => {
try {
const data = await fetch(url);
const response = await data.json();
} catch (error) {
console.log(error);
}
};
你也可以使用它从外部url获取数据。
其他回答
您可以使用fetch()在async await的帮助下完成此操作。这是从url获取数据的最新和最安全的方式。
const url = "../asset/videoData.json";
const fetchJson = async () => {
try {
const data = await fetch(url);
const response = await data.json();
} catch (error) {
console.log(error);
}
};
你也可以使用它从外部url获取数据。
你可以使用XMLHttpRequest()方法:
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var myObj = JSON.parse(this.responseText);
//console.log("Json parsed data is: " + JSON.stringify(myObj));
}
};
xmlhttp.open("GET", "your_file_name.json", true);
xmlhttp.send();
您可以使用console.log语句(注释掉)查看myObj的响应。
如果你了解AngularJS，你可以使用$http:
MyController.$inject = ['myService'];
function MyController(myService){
var promise = myService.getJsonFileContents();
promise.then(function (response) {
var results = response.data;
console.log("The JSON response is: " + JSON.stringify(results));
})
.catch(function (error) {
console.log("Something went wrong.");
});
}
myService.$inject = ['$http'];
function myService($http){
var service = this;
service.getJsonFileContents = function () {
var response = $http({
method: "GET",
url: ("your_file_name.json")
});
return response;
};
}
如果文件在不同的文件夹中，请提到完整的路径而不是文件名。
要使用javascript读取外部本地JSON文件(data. JSON)，首先要创建数据。json文件:
data = '[{"name" : "Ashwin", "age" : "20"},{"name" : "Abhinandan", "age" : "20"}]';
然后,
在脚本源代码中提到json文件和javascript文件的路径 <script type="text/javascript" src="data.json"></script> .json . <script type="text/javascript" src="javascript.js"></script> .js 从json文件中获取Object var mydata = JSON.parse(data); 警报(mydata [0] . name); alert (mydata [0] .age); 警报(mydata [1] . name); alert (mydata [1] .age);
有关更多信息，请参阅此参考资料。
您可以使用D3来处理回调，并加载本地JSON文件数据。Json，如下所示:
<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script>
d3.json("data.json", function(error, data) {
if (error)
throw error;
console.log(data);
});
</script>
非常简单。 将json文件重命名为“.js”而不是“.json”。
<script type="text/javascript" src="my_json.js"></script>
所以正常地遵循你的代码。
<script type="text/javascript">
var obj = JSON.parse(contacts);
然而，只是为了信息，我的json内容看起来像下面的剪辑。
contacts='[{"name":"bla bla", "email":bla bla, "address":"bla bla"}]';
