Ajax 与 Comet

xiaoxiao2021-02-28  10

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);
转载请注明原文地址: https://www.6miu.com/read-1100050.html

最新回复(0)