ajax
原生Ajax
window.onload=function(){
// 1) 创建 XMLHttpRequest 对象,也就是创建一个异步调用对象
var request=new XMLHttpRequest();
// 2) 创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL 及验证信息
request.open("get","./00 data.json");
// 3) 设置响应 HTTP 请求状态变化的函数
request.onreadystatechange=function(){
if(request.status===200 && request.readyState===4){ 状态
// console.log(request.responseText)
// 5) 获取异步调用返回的数据
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();
}
jQuery
$.get("./00 data.json",function(data){
console.log(data);
if(data.status===200){
var cls=data.data;
$("legend").text(cls.name);
var students=cls.student;
for (let index = 0; index < students.length; index++) {
const stu = students[index];
// console.log(stu)
$(".data tbody").append("<tr><td>"+stu.id+"</td><td>"+stu.name+"</td></tr>");
}
}else{
console.log(data.msg);
}
})
//url [data] success [dataType]
// $.post()
})
1) 创建 XMLHttpRequest 对象,也就是创建一个异步调用对象
// $.ajax({
// //请求方式
// type:"get",
// //请求地址
// url:"./00 data.json",
// //data:{id:10001},//请求参数
// //data:"id=10001&name=zhangsan",//application/x-www-form-urlencoded
// dataType:"json",//返回数据格式
// //contentType:"json",//请求格式 参数格式
