Ajax 与 Comet

目录

Ajax 与 Comet 目录Ajax 1 XMLHttpRequest 对象2 XHR用法

Ajax-Asynchronous Javascript + XML Ajax通信与数据格式无关，是无刷新页面即可从服务器取得数据部分或全部页面。

1. Ajax

1.1 XMLHttpRequest 对象

创建XMLHttpRequest对象xhr：

function createXHR(){ if(typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); //支持IE7+,ff,opera,chrome,safari }else if(typeof ActiveXObject != "undefined"){//兼容IE7- if(typeof arguments.callee.activeXString != "string"){ var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.3", "MSXML2.XMLHttp"], i,len; for(i=0,len=versions.length; i<len; i++){ try{ new ActiveXObject(versions[i]); arguments.callee.activeXString = versions[i]; break; }catch(e){ //跳过 } } } return new ActiveXObject(arguments.callee.activeXString); }else{ throw new Error("no XHR object available."); } }

1.2. XHR用法

只能向同一个域中使用相同端口和协议的URL发送请求。

1）准备发送：并不会真正发型请求，而是启动一个请求以备发送 （1） xhr.open(type,url,async); type: “get” 或 “post”, url : 请求的URL， async : 表示是否异步请求的布尔值 2）发送请求：请求分派到服务器 xhr.send(data); data : 请求所发送的数据，如果没有则必须置为null 3）接收响应：

收到响应后，响应数据会自动填充xhr对象的属性。 接收响应后，第一步检查status属性，以确定响应已经成功返回。 XHR对象属性： （1）responseText : 请求返回的主体文本； （2）responseXML : 如果响应的内容类型是“text/xml”或“application/xml”，这个属性保存包含响应数据的XML DOM文档； （3）status : 响应的HTTP状态；

①200：表示responseText属性的内容已经就绪，内容类型正确情况下，reponseXML也能访问； ②304：表示请求的资源并没有被修改，可以直接使用浏览器缓存版本； ③400：无法找到请求的资源； ④401：访问资源的权限不够； ⑤403：没有权限访问资源； ⑥404：访问的资源不存在； ⑦405：访问的资源被禁止； ⑧407：访问的资源需要代理认证； ⑨414：请求的url太长； ⑩500：服务器内部错误；

（4）statusText : HTTP状态说明。 （5）readyState : 请求/响应过程的当前活动阶段，且其值的改变会触发readystatechange事件。必须在调用open方法之前指定onreadystatechange事件处理程序才能确保跨浏览器兼容性。

①0 ：未初始化。尚未调用open()方法； ②1 ：启动。已经调用open()方法，但尚未调用send方法； ③2 ：发送。已经调用send()方法，但尚未接收到响应； ④3 ：接收。已经接收部分响应数据； ⑤4 ：完成。已经接收全部响应数据，而且已经可以在客户端使用。 同步请求： var xhr = new XMLHttpRequest(); xhr.open("get",url,false); xhr.send(null); if((xhr.status >= 200 || xhr.status < 300) || xhr.status == 304){ //请求响应成功 alert(xhr.responseText); }else{ //请求失败 alert("请求失败："+xhr.status); } 异步请求： var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if(xhr.readystate == 4){ if((xhr.status >= 200 || xhr.status < 300) || xhr.status == 304){ //请求响应成功 alert(xhr.responseText); }else{ //请求失败 alert("请求失败："+xhr.status); } } } xhr.open("get",url,true); xhr.send(null);

---