原声Ajax的使用

要学习ajax首先要了解xmlhttprequest对象，这是ajax的核心，通过这个对象向服务器发出异步请求，从服务器获取数据，然后JavaScript操作DOM从而更新页面。

最关键的获取数据的过程：

首先了解xmlhttprequest 对象的属性：

onreadystatechange:每次状态改变所触发事件的事件处理程序。

responseText：从服务器返回字符串的数据

responseXml：从服务器返回xml形式

status：404未找到 200已就绪

status text:伴随状态码的文本信息

readystatus：对象状态值

　　　　　　0（未初始化）对象建立，尚未调用方法（open）

　　　　　　1（初始化）对象已建立，尚未调用send方法

　　　　　　2（发送数据）调用send方法,当前状态和http头未知

　　　　　　3（数据传送中）已接受部分数据，但http头不全，responsebody 和responseText 数据可能出错。

　　　　　　4（完成）已接受全部数据，数据完整

一下写一个完整的原生ajax程序：

//创建xmlhttprequest 对象

function createXHR(){
//不同的浏览器创建方式不同
//非IE浏览器
var xhr=null;

　　if(window.xmlHttpRequest){
　　　　xhr=new XmlHttpRequest();
　　}
//IE浏览器
　　if(window.activeXObject){
　　try{
　　　　xhr=new ActiveXObject("Mcrosoft.XMLHTTP");
　　}catch(e){
　　　try{
　　　　xhr=new ActiveXObject("msxml2.XMLHTTP");
　　　　　　}catch(ex){
}
}
}
}

 

function testAjax(){

//创建ajax

createXHR();

if(!xhr){

console.log("xmlhttprequest创建异常");//控制台打印

return false;

}

xhr.open("post",url,false);

xhr.onreadystatuschange=function(){

　　if(xhr.readystauts==4){

　　console.log="数据在加载";

　　　　if(xhr.stauts==200){

　　console.log(xhr.responseText);

}　　

}

}

xhr.send();

}

 

}