摘要:如果響應(yīng)的內(nèi)容類型是或,這個屬性將保存包含著響應(yīng)數(shù)據(jù)的文檔。響應(yīng)的狀態(tài)狀態(tài)的說明當(dāng)對象把一個請求發(fā)送到服務(wù)器的過程中會經(jīng)歷幾個狀態(tài),直到請求被處理,然后才接收一個回應(yīng)。
1.什么是Ajax
Ajax:是Asynchronous Javascript And XML的簡寫,即異步JavaScript和XML
用途:動態(tài)刷新局部數(shù)據(jù),無需卸載整個頁面,從而帶來更好的用戶體驗
Ajax核心:XMLHttpRequest對象(簡稱XHR)
以下是一個跨瀏覽器創(chuàng)建XHR對象的函數(shù):
function createXHR() { if (typeof XMLHttpRequest !== "undefined") { return new XMLHttpRequest(); }else if{ if (typeof ActiveXString != "undefined") { var versions = [ "MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp" ]; for ( var i = 0, len = versions.length; i < len; i++) { try { var xhr = new ActiveXObject(versions[i]); arguments.callee.activeXString = versions[i]; break; } catch (error) { // ... } } } return new ActiveXObject(arguments.callee.activeXString); }else { throw new Error("No XHR object avaliable."); } }
XMLHttpRequest這個對象的屬性:
responseText 作為響應(yīng)主體返回的文本。
responseXML 如果響應(yīng)的內(nèi)容類型是"text/xml"或"application/xml",這個屬性將保存包含著響應(yīng)數(shù)據(jù)的xml DOM文檔。
status 響應(yīng)的http狀態(tài)
statusText http狀態(tài)的說明
當(dāng)XHR對象把一個HTTP請求發(fā)送到服務(wù)器的過程中會經(jīng)歷幾個狀態(tài),直到請求被處理,然后才接收一個回應(yīng)。readyState是XHR請求的狀態(tài)屬性,它本身有5個屬性值:
0(未初始化)還沒有調(diào)用open()方法
1(啟動)已調(diào)用send()方法,正在發(fā)送請求
2(發(fā)送)send()方法完成,已收到全部響應(yīng)內(nèi)容
3(接收)已經(jīng)接收到部分響應(yīng)內(nèi)容
4(完成)響應(yīng)內(nèi)容解析完成,可以再客戶端使用了
3.實現(xiàn)Ajax的步驟A.創(chuàng)建一個XHR對象
var xhr= createXHR();
B.設(shè)置響應(yīng)HTTP請求狀態(tài)變化的函數(shù)
xhr.onreadystatechange = function() { if(xhr.readyState==4){ if(xhr.status >= 200 && xhr.status < 300 &&xhr.status == 304){ xxx.innerHTML = xhr.responseText;//刷新了xxx中的數(shù)據(jù) } else { alert("Request was failed:"+xhr.status); } } };
C.創(chuàng)建一個新的HTTP請求,并指定該HTTP請求的方法、URL及表示是否異步發(fā)送請求的布爾值
xhr.open("get","getAjaxData.php",true);//true表示異步發(fā)送請求
D.設(shè)置自定義請求頭部(可選)
xhr.setRequestHeader("myHeader","myValue");//jsonp跨域請求時會用到自定義的頭部
E.發(fā)送http請求
xhr.send(null);//作為請求主體發(fā)送的數(shù)據(jù),無數(shù)據(jù)必須傳入null,post請求時經(jīng)常會發(fā)送數(shù)據(jù)
完整代碼如下:
var xhr= createXHR(); xhr.onreadystatechange = function() { if(xhr.readyState==4){ if(xhr.status >= 200 && xhr.status < 300 &&xhr.status == 304){ xxx.innerHTML = xhr.responseText; } else { alert("Request was failed:"+xhr.status); } } }; xhr.open("get","getAjaxData.php",true); xhr.setRequestHeader("myHeader","myValue"); xhr.send(null);
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/79028.html
摘要:前言它是一個中介代理服務(wù)器是網(wǎng)絡(luò)的中間實體。代理位于客戶端和服務(wù)器之間,扮演中間人的角色。 前言 它是一個中介 Web代理(proxy)服務(wù)器是網(wǎng)絡(luò)的中間實體。 代理位于Web客戶端和Web服務(wù)器之間,扮演中間人的角色。HTTP的代理服務(wù)器即是Web服務(wù)器又是Web客戶端 Proxy代理軟件 mac常用的proxy軟件有Charles proxy軟件只能映射你瀏覽器的請求的host ...
摘要:前言它是一個中介代理服務(wù)器是網(wǎng)絡(luò)的中間實體。代理位于客戶端和服務(wù)器之間,扮演中間人的角色。 前言 它是一個中介 Web代理(proxy)服務(wù)器是網(wǎng)絡(luò)的中間實體。 代理位于Web客戶端和Web服務(wù)器之間,扮演中間人的角色。HTTP的代理服務(wù)器即是Web服務(wù)器又是Web客戶端 Proxy代理軟件 mac常用的proxy軟件有Charles proxy軟件只能映射你瀏覽器的請求的host ...
摘要:通常的做法是,為它們指定回調(diào)函數(shù)。請求返回請求返回請求返回異步隊列解耦異步任務(wù)和回調(diào)函數(shù)為模塊隊列模塊事件提供基礎(chǔ)功能。 前言 jQuery整體框架甚是復(fù)雜,也不易讀懂,這幾日一直在研究這個笨重而強大的框架。jQuery的總體架構(gòu)可以分為:入口模塊、底層模塊和功能模塊。這里,我們以jquery-1.7.1為例進(jìn)行分析。 jquery的總體架構(gòu) 16 (function( window,...
摘要:上一篇文章簡單介紹了在本地開發(fā)環(huán)境中搭建服務(wù)端和客戶端,對單點登錄過程有了一個直觀的認(rèn)識之后,本篇將探討單點登錄的實現(xiàn)原理。因此引入服務(wù)端作為用戶信息鑒別和傳遞中介,達(dá)到單點登錄的效果。為該流程的實現(xiàn)類。表示對返回結(jié)果的處理。 上一篇文章簡單介紹了 CAS 5.2.2 在本地開發(fā)環(huán)境中搭建服務(wù)端和客戶端,對單點登錄過程有了一個直觀的認(rèn)識之后,本篇將探討 CAS 單點登錄的實現(xiàn)原理。 一...
摘要:它由微軟架構(gòu)師和開發(fā),通過利用微軟圖形系統(tǒng)和的互聯(lián)網(wǎng)應(yīng)用派生品的特性來簡化用戶界面的事件驅(qū)動程序設(shè)計。微軟的和架構(gòu)師之一于年在他的博客上發(fā)表了。更改時會得到提醒這個情況是一個單向流。 前言 記得四個月前有一次面試,面試官問我 MVVM 是什么,MVVM 的本質(zhì)是什么。我大腦一片混亂,那時我對 MVVM 的認(rèn)知就只是雙向綁定和Vue,以這個關(guān)鍵字簡單回答了幾句,我反問 MVVM 的本質(zhì)是...
閱讀 2580·2021-11-23 09:51
閱讀 2495·2021-09-30 09:48
閱讀 1094·2021-09-10 10:51
閱讀 2229·2021-08-12 13:22
閱讀 3583·2021-08-11 10:24
閱讀 2183·2019-08-30 15:55
閱讀 653·2019-08-30 14:05
閱讀 3220·2019-08-30 13:03