什么是Ajax?

在研究ajax之前首先讓我們先來討論一個問題 ——什么是Web 2.0 。聽到 Web 2.0 這個詞的時候，應該首先問一問 “Web 1.0 是什么？” 雖然很少聽人提到 Web 1.0，實際上它指的就是具有完全不同的請求和響應模型的傳統 Web。比如，到 hdu.edu.cn 網站上點擊一個按鈕。就會對服務器發送一個請求，然后響應再返回到瀏覽器。該請求不僅僅是新內容和項目列表，而是另一個完整的 HTML 頁面。因此當 Web 瀏覽器用新的 HTML 頁面重繪時，可能會看到閃爍或抖動。事實上，通過看到的每個新頁面可以清晰地看到請求和響應。

Ajax也是前端必備技能了，學習任何語言，都需要以理論為基礎的大量實踐才能真正學會，之前學了Ajax很多遍，因為缺乏大量實踐，總是會忘。所以不實踐是失敗之母。。。當然理論基礎也很重要啦，今天談談我對Ajax的基礎認知。

定義：全稱：Asynchronous JavaScript and XML（用異步的形式的JavaScript去操作XML) 用來傳輸進行數據交互 其實就是拿數據發數據。

應用：我們來想想我們編寫的HTML代碼的時候，當我們改變了里面內容了并且想看效果的時候，是不是先保存，然后去瀏覽器刷新頁面，而Ajax就是做到當頁面內容發生改變的時候能不刷新頁面，就能把改變告知我們。比如，我們注冊的時候信息填寫錯誤，是不是沒刷新頁面就能直接看到信息提示，比如我們玩QQ的時候，有什么消息都會提醒你，絲毫沒有刷新頁面，絲毫沒有影響你干別的事情，這就是Ajax做的事情。

下面我們先不解析具體的原理，先來看一個大致的實現過程。

當然首先，你得知道是把代碼放在服務器下運行的，打開的時候不能用本地的地址，要用localhost/。。這種形式才是在服務下訪問的。要是這不了解的話，可以先自行百度下。

栗子需求：新建一個文字1.txt,隨便輸入什么內容，新建HTML頁面，點擊頁面里的按鈕獲取1.txt里面的內容

var oBtn = document.getElementById('btn');oBtn.onclick = function(){var xhr = new XMLHttpRequest(); //創建Ajax對象xhr.open('get','1.txt',true); //設置請求信息 xhr.send();//提交請求//等待服務器返回內容xhr.onreadystatechange = function() {if ( xhr.readyState == 4 ) {alert( xhr.responseText ); //彈出內容} } }

當點擊按鈕的時候，你會發現彈出了1.txt里面的內容。

我們來具體解析一下這個步驟

var xhr = new XMLHttpRequest(); //創建Ajax對象

我們要用Ajax獲取數據，首先呢，要創建一個Ajax對象，就跟你想獲取系統時間要創建一個時間對象是一個道理。對象的名稱就是 XMLHttpRequest()，創建好之后我們就可以用對象下的方法屬性進行數據交互了。