ajax json实例

AJAX和JSON是前端开发中非常常见的技术，AJAX可以通过异步请求数据，不需要刷新整个页面，实现数据展示的无刷新操作；JSON则是一种轻量级的数据交换格式，适合于数据的传输。

以下是一个简单的AJAX和JSON的实例，该实例通过AJAX从服务器获取数据，并将获取到的数据解析为JSON格式，最后将JSON数据展示在页面上。

var xhr = new XMLHttpRequest();
    xhr.open('GET', '/api/data', true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 &
    &
 xhr.status == 200) {
    var response = JSON.parse(xhr.responseText);
    var output = document.getElementById('output');
    for (var i = 0;
     i  response.length;
 i++) {
    var item = response[i];
    var p = document.createElement('p');
    p.innerHTML = item.name + ' is ' + item.age + ' years old.';
    output.appendChild(p);
}
}
}
    ;
    xhr.send();
    

以上代码中，首先创建了一个XMLHttpRequest对象，并使用open方法打开一个GET请求，请求的地址是'/api/data'，第三个参数为true表示使用异步请求，不会阻塞页面。然后设置了onreadystatechange事件，当readState为4且status为200时，说明获取数据成功，将responseText解析为JSON格式。最后，遍历JSON数据，将每个数据项的name和age拼接为字符串，并创建一个p标签展示在页面上。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！