基础数据格式
1) 创建 XMLHttpRequest 对象,也就是创建一个异步调用对象
2) 创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL 及验证信息
3) 设置响应 HTTP 请求状态变化的函数
4) 发送 HTTP 请求
5) 获取异步调用返回的数据
6) 使用 JavaScript 和 DOM 实现局部刷新
源码:
window.onload=function(){ var repuset=new XMLHttpRequest(); repuset.open("get","01data.json"); repuset.onreadystatechange=function(){ if(repuset.status===200 && repuset.readyState===4){ console.log(repuset.responseText); var data=JSON.parse(repuset.responseText); console.log(data); } } repuset.send(); } jq方式调用ajax:
源码:
script部分: $(function(){ // 创建 jquery 对象,也就是创建一个异步调用对象 $.ajax({ method:"get", // method 调用方式 get/post url:"01data.json", // 调用ajax位置 // data:{id:1000}, // 请求参数 // data:"id=1001&name=zhangsan", contentType:"json", // 返回数据格式 success:function(data){console.log(data) if(data.status===200){ var cls=data.data; $(".data lengend").text(cls.name); var students=cls.student; for(let i=0;i<students.length;i++){ const stu=students[i]; $(".data tbody").append("<tr><td>"+stu.id+"</td><td>"+stu.name+"</td></tr>") } }else{ console.log(data.msg); } }, // 成功信息 error:function(res,err){console.log(res)} // 错误信息 res是属性 err提示信息 }) }) html部分: <legend></legend> <table class="data"> <th>id</th> <th>name</th> </table> 简写:append是追加的意思