目录
一、服务器对外提供了哪些资源
二、了解Ajax
2.1什么是Ajax
2.2Ajax作用
三、jQuery中的Ajax
3.1$.get()函数的语法
3.2$.post()函数的语法
3.3$.ajax()函数的语法
四、接口
4.1接口的概念
4.2接口测试工具
4.3接口文档
一、服务器对外提供了哪些资源
如果要在网页上请求服务器上的数据资源，则需要用到XMLHttpRequest对象。
XMLHttpRequest(简称xhr）是浏览器提供的js成员，通过它，可以请求服务器上的数据资源。
最简单的用法 var xhrObj=new XMLHttpRequest()
二、了解Ajax
2.1什么是Ajax
在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式就是Ajax
2.2Ajax作用
Ajax能让我们轻松实现网页与服务器之间的数据交互
三、jQuery中的Ajax
jQuery中发起Ajax请求常用的三个方法：
$.get()
$.post()
$.ajax()
3.1$.get()函数的语法
专门用于发起get请求，从而将服务器上的资源请求到客户端来进行使用。
语法：
$.get(url,[data],[callback])
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="jquery.min.js"></script>
</head>
<body>
<button id="btnGET">发起带参数的GET请求</button>
<script>
$(function () {
$('#btnGET').on('click', function () {
$.get('http://www.liulongbin.top:3006/api/getbooks', { id: 1 }, function (res) {
console.log(res);
})
})
})
</script>
</body>
</html>3.2$.post()函数的语法
专门用来发起post请求，从而向服务器提交数据。
语法：
$.post(url,[data],[callback])
3.3$.ajax()函数的语法
功能比较综合的函数，他运行我们对Ajax请求进行更详细的配置。
$.ajax({
type:'', //请求的方式 如GET或POST
url:'', //请求的URL地址
data:{}, //这次请求要携带的数据
success:function(res){} //请求成功之后的回调函数
})四、接口
4.1接口的概念
使用Ajax请求数据时，被请求的URL地址，就叫做数据接口（简称接口），同时，每个接口必须有请求方式。
4.2接口测试工具
Postman:Download Postman | Get Started for Free
vscode添加插件：postcode
4.3接口文档
接口的说明文档，它是我们调用接口的依据。
接口文档的组成部分：
- 接口名称
- 接口URL
- 调用方式
- 参数格式
- 响应格式
- 返回示例（可选）
