基于jQuery的三种AJAX请求

基于jQuery的三种AJAX请求

1. 介绍

• get请求 通常用于 获取服务端资源（向服务器要资源）

​ 例如：根据URL地址，从服务器获取HTML文件、CSS文件、JS文件、图片文件、数据资源等。

• post请求 通常用于 向服务器提交数据（往服务器发送资源）

​ 例如：登录时向服务器提交的登录信息、注册是向服务器提交的注册信息、添加用户时向服务器提交的用户信息等各种数据提交操作。

• ajax请求 就比较综合，既可以发送 get请求 也可以发送 post请求

2. 用法

2.1. get请求

语法：

$.get(url, [data], [callback]);  // 带有中括号的参数表示可以省略

参数介绍：

参数名	是否可省略	参数类型	参数作用
url	不可省略	string	规定你请求的url
data	可省略	object	请求资源期间要携带的参数
callback	可省略	function	请求成功后所执行的函数名

案例：

 // 发送get请求，请求 bookname 为 '西游记' 的数据
 $.get('http://www.liulongbin.top:3006/api/getbooks', { bookname: '西游记' }, function (res) {
   console.log(res);  // res 是服务器返回的数据
})

2.2. post请求

语法：

$.post(url, [data], [callback]);  // 带有中括号的参数表示可以省略

参数介绍：

参数名	是否可省略	参数类型	参数作用
url	不可省略	string	规定你请求的url
data	可省略	object	要提交的数据
callback	可省略	function	请求成功后所执行的函数名

案例：

// 定义url
let url = 'http://www.liulongbin.top:3006/api/addbooks'
// 定义data数据
let data = {
  bookname: '富婆成长计',
  author: 'tuoni',
  publisher: '广东出版社'
}
// post请求
$.post(url, data, function (res) {
  console.log(res);
})

2.3. ajax请求

语法以及参数：

$.ajax({
  type: '',  // 请求的方式，例如 'GET' 或 'POST'
  url: '',  // 请求的URL地址
  data: {},  // 这次请求要携带的数据
  success： function(res) {}  // 请求成功之后的回调函数
})