Ajax

Ajax 是什么? 如何创建一个Ajax？

Ajax并不算是一种新的技术，全称是asychronous javascript and xml，可以说是已有技术的组合，主要用来实现客户端与服务器端的异步通信效果，实现页面的局部刷新，早期的浏览器并不能原生支持ajax，可以使用隐藏帧（iframe）方式变相实现异步效果，后来的浏览器提供了对ajax的原生支持

使用ajax原生方式发送请求主要通过XMLHttpRequest(标准浏览器)、ActiveXObject(IE浏览器)对象实现异步通信效果

优点：

页面无刷新，用户体验好；
异步通信，更加快的响应能力；
减少冗余请求，减轻了服务器负担；
基于标准化的并被广泛支持的技术，不需要下载插件或者小程序

缺点：

浏览器对XMLHttpRequest对象的支持度不足，存在兼容性；
Ajax干掉了back按钮，即对浏览器后退机制的破坏；
对搜索引擎的支持比较弱；
存在一定的安全问题；
无法用URL直接访问；
开发调试工具的缺乏。

Ajax应用场景：

场景1 数据验证
场景2 按需取数据
场景3 自动更新页面
Ajax 包含以下五个部分：
Ajax并非一种新的技术，而是几种原有技术的结合体。它由下列技术组合而成。
使用CSS和XHTML来表示。
使用DOM模型来交互和动态显示。
数据互换和操作技术，使用XML与XSLT
使用XMLHttpRequest来和服务器进行异步通信。
使用javascript来绑定和调用。

基本步骤：

var xhr =null;//创建对象 
		if(window.XMLHttpRequest){
				xhr = new XMLHttpRequest();
		}else{
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
		}
 xhr.open(“方式”,”地址”,”标志位”);//初始化请求 
 xhr.setRequestHeader(“”,””);//设置http头信息 
 xhr.onreadystatechange =function(){}//指定回调函数 
 xhr.send();//发送请求 

js框架（jQuery/EXTJS等）提供的ajax API对原生的ajax进行了封装，熟悉了基础理论，再学习别的框架就会得心应手，好多都是换汤不换药的内容

jQuery中的Ajax操作

方法 作用
url 请求的地址
type 请求的方式
dataType 告诉服务器，我要想返回什么类型的数据，默认json
contentType 告诉服务器，我要发送什么类型的数据 ;
async 是否异步,默认为true,异步请求
cache Boolean值,设置为false将不会从浏览器缓存中加载请求信息。
success 请求成功的回调函数
error 请求失败的回调函数
beforeSend 请求发送之前调用的函数
complete 不论请求是成功还是失败的，只要请求完成就会调用
timeout 设置请求超时
详细介绍:
jquery中的ajax方法参数总是记不住，这里记录一下。
1.url:
要求为String类型的参数，（默认为当前页地址）发送请求的地址。

2.type:
要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。

3.timeout:
要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局设置。

4.async:
要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为false。注意，同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。

5.cache:
要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息。

6.data:
要求为Object或String类型的参数，发送到服务器的数据。如果已经不是字符串，将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换，可以查看　　processData选项。对象必须为key/value格式，例如{foo1:“bar1”,foo2:“bar2”}转换为&foo1=bar1&foo2=bar2。如果是数组，JQuery将自动为不同值对应同一个名称。例如{foo:[“bar1”,“bar2”]}转换为&foo=bar1&foo=bar2。

7.dataType:
要求为String类型的参数，预期服务器返回的数据类型。如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。
8.success：
要求为Function类型的参数，请求成功后调用的回调函数，有两个参数。
(1)由服务器返回，并根据dataType参数进行处理后的数据。
(2)描述状态的字符串。
function(data, textStatus){
//data可能是xmlDoc、jsonObj、html、text等等
this; //调用本次ajax请求时传递的options参数
}

9.error:
要求为Function类型的参数，请求失败时被调用的函数。该函数有3个参数，即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下：
function(XMLHttpRequest, textStatus, errorThrown){
//通常情况下textStatus和errorThrown只有其中一个包含信息
this; //调用本次ajax请求时传递的options参数
}