首先,在這裏,我不會 對ajax異步更新的概念什麼的進行解釋,主要通過下面的框架,進行解釋,並且解決常見的瀏覽器緩存問題
<script type="text/javascript">
function ajax(url,fnSuccess,fnEnd){
if(window.XMLHttpRequest)
{
var oAjax=new XMLHttpRequest();
}
else{
var oAjax=new ActiveXObject("Microsoft.XMLHTTP");
}
//鏈接服務器
oAjax.open("GET",url,true);
//發送請求
oAjax.send();
//接收返回
oAjax.onreadystatechange=function(){
if(oAjax.readyState==4) //讀取完成
{
if(oAjax.status==200) //讀取成功
{
fnSuccess(oAjax.responseText);
}else{
if(fnEnd)
{fnEnd(oAjax.status);}
}
}
};
}
window.οnlοad=function(){
var oBtn=document.getElementById('a');
oBtn.click=function(){
ajax('a.txt?='+new Date().getTime(),function(str){});
};
};
</script>
在上面的代碼中,我對ajax的主體部分進行了一個函數的封裝,變爲之傳遞三個參數,分別爲要讀取的文件url,第二個在是讀取成功的時候調用的函數,第三則是失敗時執行的行數;
而ajax函數體中的,首先進行一個兼容性的判定,主要是爲了兼容低版本ie爲進行XMLHttpRequest 的定義,而執行else部門,在這裏我們需要主要的是裏面的window對象;
由於低版本ie中未定義XMLHttpRequest,而任何對象屬性都可以是window對象的屬性,所以相當於我們對之進行了定義,要不然低版本ie會報錯;
oAjax.open()該函數可接受三個參數,第一個爲請求的方式(GET或POST),第二個爲要打開的文件,第三個true 或flase,表示是否異步執行;
後面的由於時間關係就不多解釋了
跟着在爲點擊時間添加函數體的時候,我們可以看到'a.txt?='+new Date().getTime(),這部分只要是通過不斷的獲取一個時間戳來進行頁面的刷新,解決緩存帶來的問題/