Ajxax技术-1

1.什么是Ajax

• Ajax: Asynchronous javascript and xml (异步javascript和xml)。

• ==Ajax并不是一种新技术，而是已有技术的集合。JavaScript是核心载体==。

• Ajax优势：在不刷新页面的情况下，更新页面数据，提升用户体验。

• ==Ajax就像一个小秘书==，能够实现异步工作。

2.ajax核心对象 --- XMLHttpRequest

　　创建ZMLhttpRequest对象,兼容IE7之前和主流浏览器

  

//创建XMLHttpRequest对象，兼容低版本IE和非IE浏览器
function getXhr () {
    var xmlhttp;

    if (window.XMLHttpRequest) {
        //IE7+ 和 非IE 中都有 XMLHttpRequest对象
        xmlhttp = new XMLHttpRequest();
    } else {
        //低版本IE浏览器 实例化方式
        xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
    }

    return xmlhttp;
}

3.核心方法

 XMLHttpRequest对象有了,可以发送Ajax请求了.发送请求有两个方法:

open(var1,var2,var3):准备ajax请求

var1: 请求方式  get/post
 var2: 请求的后端程序地址
 var3: 异步(true)/同步(false)，可选参数，默认为true

 var: 分为两种情况。 如果是get请求，则填写null。 如果是post请求，则填写要发送到后端的数据。

　==发送ajax请求流程

　　1) 创建XMLHttpRequest对象

　　2) 调用open方法准备ajax请求

　　3) 调用send方法发送ajax请求

4.接收后端响应结果

Ajax的整个过程有5个状态,对应readyState的5个值:0-4

　　0: (Uninitialized) the send( ) method has not yet been invoked.

　　1: (Loading) the send( ) method has been invoked, request in progress.

　　2: (Loaded) the send( ) method has completed, entire response received. 

　　3: (Interactive) the response is being parsed. 

　　4: (Completed) the response has been parsed, is ready for harvesting.

　　0 － （未初始化）还没有调用send()方法

　　1 － （载入）已调用send()方法，正在发送请求

　　2 － （载入完成）send()方法执行完成，已经接收到全部响应内容

　　3 － （交互）正在解析响应内容

　　4 － （完成）响应内容解析完成，可以在客户端调用了

 

5.核心事件 --- onreadystatechange

      

 onreadystatechange事件:  readyState的值每次发生变化都会触发该事件。    0-->1    1-->2    2-->3    3-->4 总共触发4次

6.其他属性

　　responseText; 以字符串形式接受后端程序的返回值.

转载于:https://www.cnblogs.com/wsjaizlp/p/9863247.html