摘要：ajax 即“Asynchronous Javascript And XML”(異步 JavaScript 和 XML)，是指一種創(chuàng)建交互式網頁應用的網頁開發(fā)技術。它是一種在無需重新加載整個網頁的情況下，能夠更新部分網頁的技術。

1、什么是ajax？

ajax 即“Asynchronous?Javascript?And?XML”(異步 JavaScript 和 XML)，是指一種創(chuàng)建交互式網頁應用的網頁開發(fā)技術。它是一種在無需重新加載整個網頁的情況下，能夠更新部分網頁的技術。

通過在后臺與服務器進行少量數據交換，Ajax 可以使網頁實現異步更新。這意味著可以在不重新加載整個網頁的情況下，對網頁的某部分進行更新。

也可以理解為ajax是網頁前臺與服務器后臺進行少量數據交換的橋梁工具。

2、ajax如何實現異步加載

先來看ajax的實現代碼，然后解釋

jquery中ajax的使用，在jquery中有3種方式可以實現ajax

①$.get()

var?url='http://www.test.com';

var?data={'param1':'val1''param2':'val2',}

var?success=?function(e){

console.log(e);

}

$.get(url,data,success);

②$.post()

var?url='http://www.test.com';

var?data={'param1':'val1''param2':'val2',}

var?success=?function(e){

console.log(e);

}

$.post(url,data,success);

③$.ajax()

var?url='http://www.test.com';

var?data={'param1':'val1''param2':'val2',};

var?type='post';

$.ajax({

url:url

type:type,

dataType:dataType,

data:data,

success:function(e){

console.log(e);

},

error:function(){

}

})

三個方法中的url是我們要請求的對象，及ajax要向誰請求數據，data請求時需要傳遞的參數，url根據請求的參數返回相應的數據，success是ajax請求數據成功之后進行的操作，比如是把請求來的數據加在網頁的某個位置，還是改變網頁某個位置的內容。

在$.ajax()方法中還有兩個選項，其中一個是dataType，要求服務器返回數據的類型，json，text，xml或者html。error：在ajax請求失敗時要做的操作。

通過上面的三個方法知道，ajax異步加載的實現，簡單的說就是通過JavaScript向服務器請求數據，服務器把數據返回給JavaScript，然后JavaScript以操作dom文檔的方式把這些數據處理給頁面，以此來實現無需刷新頁面就可以加載或者更新頁面某一位置的內容。

原生的JavaScript實現ajax異步請求

function(){

var?xmlhttp;

if(window.XMLHttpRequest){???//??IE7+,?Firefox,?Chrome,?Opera,?Safari?瀏覽器執(zhí)行代碼

xmlhttp?=?new?XMLHttpRequest();

}else?{?????????????????????????????????//?IE6,?IE5?瀏覽器執(zhí)行代碼

xmlhttp?=?new?ActiveXObject("MicroSoft.XMLHTTP");

}

//確定發(fā)送方式和發(fā)送地址

xmlhttp?.open("get",url,true);

//發(fā)生ajax請求

xmlhttp?.send();

/*xmlhttp的狀態(tài)發(fā)生改變就會調用等號后面的function*/

xmlhttp.onreadystatechange?=?function(){

/*請求成功*/

if(xmlhttp.readyState==4&&xmlhttp.status==200)

{

/*處理服務器返回的結果*/

var?result?=?xmlhttp.responseText;

}

}

}

原生的js ajax請求的實現需要先判斷瀏覽器的類型，然后再決定實現哪個請求類，確定請求方式，發(fā)送ajax請求，再通過xmlhttp的變化狀態(tài)碼來確定請求是否成功，步驟非常繁瑣，很容易出錯。

而jquery執(zhí)行要引入jquery包就可以用$.get(),$.post(),$.ajax()這三個實現ajax請求，方便快捷，還不容易出錯。

2、ajax的應用

①用戶注冊

現在很多平臺在登錄之前都需要注冊，而且注冊的時候有很多信息需要填寫，如果在填寫注冊信息時不能得到及時有效的回饋，等所有信息填完提交，然后在驗證注冊信息的有效信息，一旦有一條驗證信息不通過，這時又會回到注冊界面，讓用戶再次重新填寫信息，這種體驗非常不好，不僅浪費用戶大量時間，還有可能讓平臺失去這個客戶。

如果使用ajax無刷新技術的話就可以實現每填完一步信息就會及時反饋用戶填寫信息的正確性，有錯可以及時修改，不用在等到所有信息填完在交給后臺驗證，這就給用戶注冊節(jié)省了大量的時間。

②網頁內容異步加載

如果一個網頁模塊非常多，如果一次請求加載完需要耗費很長時間，而用ajax異步加載的話，可以先加載一部分內容，訪客往下瀏覽到一定位置的時候在通過ajax加載一部分內容，通過這種逐步加載的方式來加載網頁內容，既可以節(jié)省訪客等待頁面加載的時間也可以，在一定程度上也可以節(jié)省帶寬資源。

③購物商場里的添加購物車、收藏等功能等

④文章點贊、收藏等

幾乎需要無刷新處理操作的地方都可以用ajax來實現，但有一點一定要注意ajax只是向服務器請求少量數據，如果數據量比較大的話還是用其他方法比較合適。

總結

以上是生活随笔為你收集整理的php ajax工作原理,AJAX实现页面无刷新操作原理解析的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。