Ajax请求-get(),post()

一.

数据，是网页的灵魂
数据，也是服务器对外提供的一种资源。只要是资源，必然要通过请求-》处理-》响应的方式进行获取。
如果要再网页中请求服务器的数据资源，则需要用到XMLHttpRequest对象。
XMLHttpRequest（简称xhr）是浏览器提供的js成员，通过它，可以请求服务器上的数据资源。
最简单的用法 var xhrObj=new XMLHttpRequest()

二

资源的请求方式

客服端请求服务器时，请求的方式有很多种，最常见的放方式是get和post请求。

1.get 请求通常用于获取服务端资源(向服务器要资源)

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

2.post请求通常用于向服务器提交数据(往服务器发送资源)

例如:登录时向服务器提交登录信息，注册时向服务器提交注册信息，添加用户时向服务器提交用户信息等各种数据提交操作

三了解AJAX

AJax的全称是Asynchronous JavaScript And XML （异步JavaScript和XML）
通俗的理解：在网页种利用XMLHttpRequest对象和服务器进行数据交互的方式，就是Aiax

四 Ajax的典型的应用场景

用户名检测：注册用户时，通过ajax的形式，动态检测用户名是否被占用
搜索提示：当输入关键字时，通过ajax的形式，动态加载搜索提示列表
数据分页显示：当点击页码值的时候，通过ajax的形式，根据页码值动态刷新表格的数据
数据的增删改查：数据的添加，删除，修改，查询操作，都需要通过ajax的形式，来实现数据交互
等等

五 Jquery中的AJax

　　　浏览器中提供的XMLHttpRequest用法比较复制，所以Jquery对XMLHttpRequest进行了封装，提供了一系列Ajax相关的函数，极大减低了Ajax的使用难度。
Jquery中发起Ajax请求常用的三个方法如下：
- $.get()
- $.post()
- $.ajax()

六　　Jquery中的Ajax

　　1. Jquery中的$.get()函数的功能单一，专门用来发起get请求，从而将服务器上的资源请求到客服端进行使用

　　$.get(url,[data],[callback])

　　其中，三个参数的含义如下

　　参数名参数类型是否必填说明

　　url string 是要请求的资源地址

　　data object 否请求资源期间要携带的参数

　　callback function 否请求成功时的回调函数

　　$.get()函数发起不带参数的请求，直接提供请求URL地址和请求成功后的回调函数即可，示例

$.get('http://www.liu.com:3006/api/getbooks',function(res){
    console.log(res); //这里的res是服务器返回的数据
})

　　$.get()函数发起带参数的请求，示例

$.get('http://www.liu.com:3006/api/getbooks',{id:1},function(res){
    console.log(res); //这里的res是服务器返回的数据,id是1的
})

　　2. Jquery中的$.post()函数的功能单一，专门用来发起post请求，从而向服务器提交数据

　　$.post(url,[data],[callback])

　　其中，三个参数的含义如下

　　参数名参数类型是否必填说明

　　url string 是要提交的资源地址

　　data object 否提交的数据

　　callback function 否数据提交成功时的回调函数

　　$.post()函数向服务器提交数据示例代码，示例

$.post('http://www.liu.com:3006/api/getbooks',{bookname:'西游记',author:'***'},function(res){
    console.log(res); //
})

　　3.Jquery中的$.ajax()函数的语法

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

　4.$.ajax()发起GET请求

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

　4.$.ajax()发起POST请求

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