ajax 本地json数据

AJAX（Asynchronous JavaScript and XML）是一种在不重新加载整个页面的情况下更新网页的技术。它使用XMLHttpRequest对象和JavaScript来异步地发送请求和接收数据，从而使页面更加快速响应。

在AJAX中，通常使用JSON格式来传输数据。JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，易于读写和解析。在本地开发中，我们可以使用本地JSON文件来模拟AJAX请求返回的数据。

// 本地的JSON文件，保存在data.json中
{
  "name": "小明","age": 20,"hobbies": ["游泳","旅游","阅读"],"friends": {
    "John": 30,"Kate": 25,"Tom": 22
  }
}

为了使用本地JSON数据，我们可以使用XMLHttpRequest对象的open()、send()和onreadystatechange属性来发送请求和获取数据。以下是一个简单的示例：

// 创建XMLHttpRequest对象
let xhr = new XMLHttpRequest();

// 注册readystatechange事件处理函数
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // 获取响应数据
    let data = JSON.parse(xhr.responseText);

    // 在页面中展示数据
    let name = data.name;
    let age = data.age;
    let hobbies = data.hobbies;
    let friends = data.friends;

    // ...
  }
};

// 发送GET请求
xhr.open('GET','data.json');
xhr.send();

在以上代码中，我们首先创建了一个XMLHttpRequest对象xhr，然后注册了一个readystatechange事件处理函数。在函数中，我们判断xhr.readyState是否等于4表示请求已经完成（4表示DONE），xhr.status是否等于200表示请求成功。如果条件成立，说明我们已经收到了响应数据，将响应文本使用JSON.parse()方法进行解析，然后对数据进行处理，并在页面中展示。

以上就是关于AJAX本地JSON数据的介绍。使用本地JSON数据可以方便地模拟后端返回的数据，在本地进行开发和调试。同时，我们也可以使用在线JSON工具来快速生成JSON数据。