关于Ajax的创建：
向服务器发送请求的时候，我们不必等待结果，而是可以同时做其他的事情，等
到有了结果它自己会根据设定进行后续操作，与此同时，页面是不会发生整页刷新的，提高了用户
体验。
json文件：
{
// 先判断是否是200 // 获取数据 // 返回数据
"status":200,
"data":{
"name":"Web",
"student":[
{"id":1001,"name":"张三"},
{"id":1002,"name":"李四"},
{"id":1003,"name":"王五"}
]
},
"msg":"错误信息"
}
<script>
window.onload = function () {
// 1) 创建 XMLHttpRequest 对象, 也就是创建一个异步调用对象
var request = new XMLHttpRequest();
// 2) 创建一个新的 HTTP 请求, 并指定该 HTTP 请求的方法、URL 及验证信息
request.open("get", "./data.json");
// 3) 设置响应 HTTP 请求状态变化的函数
request.onreadystatechange = function () {
if (request.status === 200 && request.readyState === 4) {
//responseXML与responseText
//都是用来获取数据的 格式不同
// console.log(request.responseText)
// console.log(request.responseXML)
// 5) 获取异步调用返回的数据 5-6都在函数里面
var data = JSON.parse(request.responseText);
//console.log(data);
// 6) 使用 JavaScript 和 DOM 实现局部刷新
if(data.status===200){
var cls=data.data;
document.querySelector("h1").innerText=cls.name;
}else{
console.log(data.msg);
}
}
}
// 4) 发送 HTTP 请求
request.send();
}
</script>
</head>
<body>
<h1></h1>
</body>