新聞中心
這篇文章將為大家詳細(xì)講解有關(guān)Ajax是什么意思,小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。
什么是 AJAX
AJAX = Asynchronous JavaScript and XML(異步的 JavaScript 和 XML)。
AJAX 不是新的編程語言,而是一種使用現(xiàn)有標(biāo)準(zhǔn)的新方法。
AJAX 是與服務(wù)器交換數(shù)據(jù)并更新部分網(wǎng)頁(yè)的藝術(shù),在不重新加載整個(gè)頁(yè)面的情況下(AJAX 是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁(yè)的技術(shù))。
通過在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換,AJAX 可以使網(wǎng)頁(yè)實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁(yè)的情況下,對(duì)網(wǎng)頁(yè)的某部分進(jìn)行更新。
傳統(tǒng)的網(wǎng)頁(yè)(不使用 AJAX)如果需要更新內(nèi)容,必需重載整個(gè)網(wǎng)頁(yè)面。
XMLHttpRequest 對(duì)象
Ajax的核心是JavaScript對(duì)象XmlHttpRequest
XMLHttpRequest對(duì)象用法
XMLHttpRequest對(duì)象有兩個(gè)重要方法 open與send
在使用XMLHttpRequest對(duì)象時(shí)要調(diào)用的第一個(gè)方法是open方法,調(diào)用方式:XMLHttpRequest.open(“get”,”default.aspx”,true); 這段代碼會(huì)針對(duì)default.aspx頁(yè)面發(fā)送get請(qǐng)求,關(guān)于這段代碼有三點(diǎn)需要注意:
1. URL是相對(duì)于當(dāng)前頁(yè)面的路徑,也可以使用絕對(duì)路徑
2. 調(diào)用open方法并不會(huì)真正的發(fā)送請(qǐng)求,而是初始化一個(gè)請(qǐng)求準(zhǔn)備發(fā)送
3. 只能向同一個(gè)域中使用相同協(xié)議和端口的URL發(fā)送請(qǐng)求,否則會(huì)因?yàn)榘踩驁?bào)錯(cuò)
要想把請(qǐng)求發(fā)往服務(wù)器需要調(diào)用send方法,send方法接受一個(gè)參數(shù),參數(shù)是請(qǐng)求主體要發(fā)送的數(shù)據(jù),如果不需要發(fā)送數(shù)據(jù)則傳入null,在調(diào)用send方法之后請(qǐng)求被發(fā)往服務(wù)器,如下
xhr.send(null);
請(qǐng)求發(fā)往服務(wù)器,服務(wù)器根據(jù)請(qǐng)求生成響應(yīng)(Response),傳回給XHR對(duì)象,在收到響應(yīng)后相應(yīng)數(shù)據(jù)會(huì)填充到XHR對(duì)象的屬性,有四個(gè)相關(guān)屬性會(huì)被填充:
1. responseText:作為響應(yīng)主體被返回的文本
2. responseXML:如果響應(yīng)內(nèi)容的類型是”text/xml”或”application/xml”,這個(gè)屬性將保存包含著相應(yīng)數(shù)據(jù)的XML文檔
3. status:響應(yīng)的HTTP狀態(tài)(200,404,500等)
4. statusText:HTTP狀態(tài)說明
onreadystatechange 事件
當(dāng)請(qǐng)求被發(fā)送到服務(wù)器時(shí),我們需要執(zhí)行一些基于響應(yīng)的任務(wù)。
每當(dāng) readyState 改變時(shí),就會(huì)觸發(fā) onreadystatechange 事件。
readyState 屬性存有 XMLHttpRequest 的狀態(tài)信息。
下面是 XMLHttpRequest 對(duì)象的三個(gè)重要的屬性:
在 onreadystatechange 事件中,我們規(guī)定當(dāng)服務(wù)器響應(yīng)已做好被處理的準(zhǔn)備時(shí)所執(zhí)行的任務(wù)。
當(dāng) readyState 等于 4 且狀態(tài)為 200 時(shí),表示響應(yīng)已就緒:
xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState== && xmlhttp.status==) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } }
我們可以在接受響應(yīng)之前調(diào)用abort方法取消異步請(qǐng)求:XMLHttpRequest .abort();
注意:
在使用XMLHttpRequest對(duì)象的send()方法時(shí),如果使用的是get請(qǐng)求或者不需要發(fā)送數(shù)據(jù)的post請(qǐng)求時(shí),需要使用send(null);
如果想要發(fā)送數(shù)據(jù)數(shù)據(jù),則需要使用post請(qǐng)求,先使用 setRequestHeader() 來添加 HTTP 頭。然后在 send() 方法中規(guī)定您希望發(fā)送的數(shù)據(jù):
xmlhttp.open("POST","ajax_test.asp",true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("fname=Bill&lname=Gates");
關(guān)于“Ajax是什么意思”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,使各位可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),請(qǐng)把它分享出去讓更多的人看到。
網(wǎng)站欄目:Ajax是什么意思-創(chuàng)新互聯(lián)
轉(zhuǎn)載源于:http://fisionsoft.com.cn/article/dpegjh.html