鄧立瑤 廊坊師範學院資訊科技提高班十三期
前言:
Jquery中ajax方法中async用於控制同步和非同步，當async值為true時是非同步請求，當async值為fase時是同步請求。ajax中async這個屬性，用於控制請求資料的方式，預設是true，即預設以非同步的方式請求資料。
概念解釋：
一.什麼是同步請求：(false)
同步請求即是當前發出請求後，瀏覽器什麼都不能做，必須得等到請求完成返回資料之後，才會執行後續的程式碼，相當於是排隊，前一個人辦理完自己的事務，下一個人才能接著辦。也就是說，當JS程式碼載入到當前AJAX的時候會把頁面裡所有的程式碼停止載入，頁面處於一個假死狀態，當這個AJAX執行完畢後才會繼續執行其他程式碼頁面解除假死狀態(即當ajax返回資料後，才執行後面的function2)。 二.什麼是非同步請求：(true) 非同步請求就當發出請求的同時，瀏覽器可以繼續做任何事，Ajax傳送請求並不會影響頁面的載入與使用者的操作，相當於是在兩條線上，各走各的，互不影響。 一般預設值為true，非同步。非同步請求可以完全不影響使用者的體驗效果，無論請求的時間長或者短，使用者都在專心的操作頁面的其他內容，並不會有等待的感覺。
兩者區別：
非同步：在非同步模式下，當我們使用AJAX傳送完請求後，可能還有程式碼需要執行。這個時候可能由於種種原因導致伺服器還沒有響應我們的請求，但是因為我們採用了非同步執行方式，所有包含AJAX請求程式碼的函式中的剩餘程式碼將繼續執行。如果我們是將請求結果交由另外一個JS函式去處理的，那麼，這個時候就好比兩條執行緒同時執行一樣。
同步：在同步模式下，當我們使用AJAX傳送完請求後，後續還有程式碼需要執行，我們同樣將伺服器響應交由另一個JS函式去處理，但是這時的程式碼執行情況是：在伺服器沒有響應或者處理響應結果的JS函式還沒有處理完成return時，包含請求程式碼的函式的剩餘程式碼是不能夠執行的。就好比單執行緒一樣，請求發出後就進入阻塞狀態，知道接觸阻塞餘下的程式碼才會繼續執行。
程式碼：
一：同步事件
//跨瀏覽器新增事件 function addEvent(obj, type, fn) { if (obj.addEventListener) { obj.addEventListener(type, fn); } else { obj.attchEvent("on" + type, fn); } }; //同步方式 addEvent(document, "click", function () { var xhr = new XMLHttpRequest();//建立xhr xhr.open('get', 'test.xml? rand=' + Math.random, false); //準備傳送請求，以get方式請求，url是test.xml，同步 xhr.send(null); //傳送請求，get不需要資料提交，則填寫為null //alert(xhr.responseText); //打印出伺服器端列印回來的資料 // alert(xhr.status); //獲取當前資料的是否成功，成功返回的是200 //alert(xhr.statusText);//獲取成功或失敗後返回的文字，成功返回OK if (xhr.status == 200) { alert(xhr.responseText); } else { alert('獲取資料錯誤！錯誤程式碼：' + xhr.status + '錯誤資訊：' + xhr.statusText); } });
二 ：非同步事件
//使用非同步方式
addEvent(document, "click", function () {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) { //只有當頁面完成及接受全部的相應後，才真正的使用。分為了xhr.readystate==1,啟動；2，傳送，3，接受，4，完成。
if (xhr.status == 200) {
alert(xhr.responseText);
} else {
alert('獲取資料錯誤！錯誤資訊：' + xhr.status + '錯誤資訊：' + xhr.statusText);
}
};
}
xhr.open('get', 'test.xml? rand=' + Math.random, true);
xhr.abort(); //取消非同步的函式。
xhr.send(null);
})