AJAX的true異步或false同步
ajax的true非同步或false同步:
在ajax簡單介紹一章節介紹過，AJAX指的是非同步javascript 和XML（Asynchronous JavaScript and XML） 。
這對web開發來說是一個非常大的進步，可以有效的提高網站的人性化程度，在此之前，如果有比較費時的請求操作，必然會引起程序掛起和停止的現象，那麼使用ajax的非同步操作就無需等待伺服器的回應，而是進行如下操作:
（1）.在等待伺服器回應時執行其他腳本。
（2）.當回應就緒後對回應進行處理。
一.關於open()方法:
下面再對open()方法做一下簡單介紹，語法結構如下:
xmlhttp.open(method,url,async);
關於此方法更多內容可以參閱ajax的post或get伺服器請求一章節。
可以看到open()方法有三個參數，最後一個參數是一個布林值，就是用來規定是否採用非同步方式。
當async=true的時候，也就是規定採用非同步操作，也就是說ajax操作並不會阻塞程式碼的執行，等執行處理完畢透過onreadystatechange事件對回應進行處理，程式碼實例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.php.cn/" />
<title>php中文网</title>
<script>
function loadXMLDoc(){
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("show").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/asset/demo.ajax.php?dm=txt&act=getfruits",true);
xmlhttp.send();
}
window.onload=function(){
var obt=document.getElementById("bt");
obt.onclick=function(){
loadXMLDoc();
}
}
</script>
</head>
<body>
<div id="show"><h2>原来的内容</h2></div>
<button type="button" id="bt">查看效果</button>
</body>
</html> 上面的程式碼就是進行的一個非同步操作，透過onreadystatechange事件來處理回應。
當async=false的時候，採用的是同步處理，那麼就沒有必使用onreadystatechange事件，把對應的操作程式碼放在send()方法之後即可，程式碼如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.php.cn/" />
<title>php中文网</title>
<script>
function loadXMLDoc() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "/asset/demo.ajax.php?dm=txt&act=getfruits", false);
xmlhttp.send();
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("show").innerHTML = xmlhttp.responseText;
}
}
window.onload = function () {
var obt = document.getElementById("bt");
obt.onclick = function () {
loadXMLDoc();
}
}
</script>
</head>
<body>
<div id="show"><h2>原来的内容</h2></div>
<button type="button" id="bt">查看效果</button>
</body>
</html>上面的程式碼並沒有採用非同步操作，如果ajax操作比較耗時的話，可能會導致程式碼堵塞的現象，所以不建議使用。
許多初學者對兩者的差異可能還不夠明了，上面程式碼也沒有很好的示範這一點，下面就透過兩段程式碼示範一下它們的差別:
程式碼實例一:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>php中文网</title>
<script>
function loadXMLDoc() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("show").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "demo/ajax/net/Async.aspx", true);
xmlhttp.send();
}
window.onload = function () {
loadXMLDoc();
var odiv = document.getElementById("content");
odiv.innerHTML = "由于是异步操作，所以不会阻塞当前内容的显示。";
}
</script>
</head>
<body>
<div id="show"><img src="wait.gif"></div>
<div id="content"></div>
</body>
</html>上面的程式碼是非同步操作，所以當ajax請求的程式碼在後台處理的時候，並不影響其他程式碼的執行，所以等待回應的時候，依然能夠在下面的div中寫入指定的內容，這就是ajax的一個重大有點。
程式碼實例二:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.php.cn/" />
<title>php中文网</title>
<script>
function loadXMLDoc() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "demo/ajax/net/Async.aspx", false);
xmlhttp.send();
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("show").innerHTML = xmlhttp.responseText;
}
}
window.onload = function () {
loadXMLDoc();
var odiv = document.getElementById("content");
odiv.innerHTML = "由于是同步操作，所以会阻塞当前内容的显示。";
}
</script>
</head>
<body>
<div id="show"><img src="wait.gif"></div>
<div id="content"></div>
</body>
</html>上面的程式碼在進行ajax後台操作的時候，並不能執行下面的程式碼，只能等待處理完畢，再去執行後面的程式碼。
上例中所有呼叫的檔案都可在本機建立變更使用。
