day02_Ajax

ajax工作原理

• 浏览器端：

发生某个事件，创建XMLHttpRequest对象，发送HttpRequest

• 服务器端：

处理HttpRequest，创建响应并将数据返回给浏览器

• 浏览器端：

使用js处理被返回的数据，更新页面内容

XHR

• 创建对象

xmlHttpRequest 用于与服务器交换数据（xmlhttp=new XMLHttpRequest();）

• 请求

method：

GET：
更简单，大部分情况都适用
POST：
1.无法使用缓存文件（更新服务器上的文件或数据库）
2.向服务器发送大量数据（POST 没有数据量限制）
3.发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠
4.post发送请求头、setRequestHeader(header,value)

url：

url 参数是服务器上文件的地址

async：

true（异步）或 false（同步）
异步：无需等待服务器的响应，在响应前可以执行其他脚本。响应就绪后再对响应进行处理

• 响应

获得来自服务器的响应，则需要使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
responseText：获取字符串形式响应数据
responseXML：获取xml形式响应数据

• onreadystatechange 事件

当 readyState 等于 4 且状态为 200 时，表示响应已就绪

回调函数
多个ajax用到相同代码时，可将此代码写成function函数，下次用到时可直接调用此函数

$ajax中常用各个参数含义

url：发送请求的地址。
type：请求方式，默认为get
timeout：Number类型的参数，设置请求超时时间（毫秒)
async:默认设置为true(异步请求)。
cache:默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息。
data:发送到服务器的数据。get请求中将附加在url后。
dataType:服务器返回的数据类型。可用的类型:xml,html,script,json,jsonp,text.
success：请求成功后调用的回调函数
error:请求失败时被调用的函数。.
contentType：发送信息至服务器时，内容编码类型
dataFilter：给Ajax返回的原始数据进行预处理的函数。
username：用于响应HTTP访问认证请求的用户名。
.password：用于响应HTTP访问认证请求的密码。