使用Ajax读取JSON文件并展示的方法如下:
1. 创建XMLHttpRequest对象
var xmlhttp = new XMLHttpRequest();
2. 发送请求
xmlhttp.open("GET", "data.json", true);
xmlhttp.send();
3. 监听请求状态变化
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// 处理响应数据
}
};
4. 处理响应数据
var data = JSON.parse(xmlhttp.responseText);
// 对数据进行展示
完整代码示例:
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "data.json", true);
xmlhttp.send();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var data = JSON.parse(xmlhttp.responseText);
// 对数据进行展示
}
};
其中,data.json是需要读取的JSON文件的路径,可以根据实际情况进行修改。读取到的数据可以通过JSON.parse()方法将JSON格式的字符串转换成JavaScript对象,然后进行展示。
网友留言: