jq封装post请求数据_ajax使用，请求数据，原理及封装

先开始简单的介绍下ajax这个东西。

ajax是什么：

ajax简单的说就是做数据交互使用的。

Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。

Ajax的核心是JavaScript对象XmlHttpRequest。

ajax是异步的。

同步：一次一个，前一个没完后一个不能开始

异步：一次一堆，前一个没完后一个也能开始

ajax的优点

Ajax的给我们带来的好处大家基本上都深有体会，在这里我只简单的讲几点：

** 1、** 最大的一点是页面无刷新，在页面内与服务器通信，给用户的体验非常好。提高用户体验，节约资源，节约带宽。

** 2、** 使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。

** 3、** 可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。

** 4、** 基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

缺点我就不说了。。。

下面开始正文介绍使用：

注：我们使用ajax不要想太多

** 1、** 后台要什么——看接口文档、问后台、看代码。

** 2、** 请求——要什么给什么

** 3、** 数据接收、解析

** 4、** 使用数据——跟ajax无关

首先说一下ajax的js原生封装吧。

ajax封装：

** 1、** 创建

** 2、** 拼字符串

** 3、** 连接服务器——

** 4、** 发送——

** 5、** 接收

封装：

这里我就拿算是最终版的来说吧(根据一些框架的需要传的参数来封装)

当我们要用ajax时候 假设我有一个名字叫ajax的封装函数

ajax({url:'',data:{},type:'',timeout:**,success:fn,error:fn);

解释一下：参数比较多，所有就传一个json。

url是你要路径/文件等，下面我就假设有一个post.php文件，

data是我们要传的数据，服务器要什么，我们就传什么，下面我就用a,b举例。

type这个是有要交互的类型 类型常用有两种：get，post,(至于jsonp在下面说，和这个不同)。

timeout时间，超过这个时间我就来中断ajax，不能一直等着可不。

** 注** ：****以下我会一直用这些参数来代替。

ajax({

url:'post.php',

data:{

a:12,

b:3

},

type:'post',

timeout:5000,

success:function(res){

alert(res);

},

error:function(){

alert('失败了');

}