Ajax 知识点

1.Ajax概述

1.优点：
无页面刷新，用户体验好
2.请求与响应
请求：访问服务器端的任何一个程序都可以成为请求
响应：服务器接收请求，并根据请求的内容处理，将处理结果返回给客户端成为响应。
ajax模式在注册用户案例中也有2次请求和响应。
1.请求1和响应1.与传统模式一致
2.在用户名文本框上绑定失焦事件，一但失焦就会触发一次请求，将用户名发送后台程序，响应2：与传统模式一致
ajax自动向服务器发送请求是谁来完成的：
XMLHttp Request 对象完成的
asynchronous javascript and xml（异步javascript 和xml）
xml扩展标记语言，可以自定义标签属性

Ajax并不是一种新技术，而是已有技术的集合，JavaScript是核心载体。
Ajax优势： 再不刷新页面的情况下，更新页面数据，提升用户体验。
Ajax就像一个小秘书，能够实现异步工作。

2.Ajax使用

创建XMLHTTPRequest
var xhr = new ActiveXObject(‘Microsoft.XMLHTTP’); 最原始的
var xhr = new ActiveXObject(‘Msxml2.XMLHTTP’); 升级
var xhr = new XMLHttpRequest();非IE,包括IE8后的版本
兼容性写法

var xhr = null;
try{
    xhr = new XMLHttpRequest();  //非IE
} catch(e) {
    try{
        xhr = new ActiveXObject('Msxml2.XMLHTTP');
    } catche(e) {
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }   
}

核心属性readyState（5个状态，5个值）

      0: 创建ajax对象了
      1: 已经调用open方法了,准备好了ajax请求
      2: 已经调用send方法了,发送了ajax请求
      3: 服务器端返回了部分数据
      4: 服务器数据返回完毕，ajax请求完毕

当readyState=4时，后台程序已经处理完ajax请求，并将数据返回给前台，至此，Ajax程序结束。将结果显示在页面上属于js操作，和ajax无关。
ajax核心方法
open（var1，var2，var3）；准备发送ajax请求
参数1：请求方式post或者get
参数2：请求的后台程序的地址，后台程序一般都是PHP、JSP（Java）、Asp（微软），返回的都是html。只要后台文件最终产生了一个字符串，就都能够拿到，a.txt里面字符串都可以获取
参数3：同步（false）异步（true 默认）
send（var）：向后台发送ajax请求
参数有两种情况，GET请求，参数为空;POST请求，参数为post表单对象
其他重要属性和事件
responseText：以字符串形式接收后台返回的数据
responseXML：以XML格式接收后台返回的数据（很少用）
onreadystatechange：readyState
1.发生改变时触发事件
2.ready.State每次发生改变时都会触发该事件。触发4次
使用方式：xmlhttp.onreadystatechange=函数名
xmlhttp.onreadystatechange=function（）｛函数体｝匿名函数。

3.POST和GET

POST实现新用户注册
1.使用open方法时，设置参数1为post；设置参数2为请求后台PHP程序地址xhr.open（’post’,’check.php’）;
2.在调用send方法发送请求之前，将传输输入格式转换为xml格式
xhr.setRequestHeader（’content-type’,’application/x-www-form-urlencoded’）；该操作必须在open之后，send之前
3.使用send方法时，可以设置参数为传参形式 var data=’name=zs&passwd=123’ xhr.send(data);

4.GET缓存

什么是缓存 （但是获取实时数据时，缓存会成为问题）
浏览器的一次请求需要从服务器获得许多 css、img、js 等相关的文件，如果每次请求都把相关的资源文件加载一次，对 带宽、服务器资源、用户等待时间 都有严重的损耗。如果浏览器将css、img、js等文件在第一次请求成功后就保存在本机上，以后的每次请求就在本机获得相关的资源文件，那么就可以明显地加快用户的访问速度，同时可以节省各种资源(带宽、服务器资源、用户等待时间)。
解决方法
1.在open方法中访问地址增加一个随机后缀(随机数或者时间戳)，也就意味着每次访问的url地址是不一样的（常用）
2.在php程序中设置不进行缓存 （极少用，一般用第一种）
header(‘cache-controller:no-cache’);
header(‘Pragam:no-cache’);
header(‘Expires:-1’);

5.同步和异步

6.Ajax程序关键点总结

1.ajax的优势：在不刷新页面的情况下，就能更新页面数据
2.核心对象：XMLHttpRequest IE和非IE实例化的方式不同
3.核心属性：readyState、responseText、responseXML
4.核心方法：open（）、send（）
5.核心事件：onreadystatechange