學習AJAX

其實對ajax的學習從上個星期就開始了，主要是上個星期我所在的一個IT夏令營教授Javascript，因此我邊學基本語法邊學ajax的部分，過程我發現其實js的語法規則和c++很像，因此我只用了一個多小時就把js的基本語法熟悉了，而後就是對ajax的學習了，那麼就開始ajax的學習。

Http協議規定了對服務器如何發起請求和如何響應並處理請求。一般Http並不在腳本的控制下。只有當用戶單擊連接、提交表單和輸入url是發生，但js能夠操縱Http。當腳本設置了window對象的location屬性或調用表單對象的submit()方法時，都會初始化Http請求，簡單的說就是刷新了頁面或加載了新頁面。Ajax應用的主要特色是使用ajax技術把用戶的交互數據記錄記錄到服務器中，也能夠開始只顯示簡單頁面，以後按須要腳在額外的數據和頁面組建來提高應用的啓動時間。（這裏你們要注意一個地方，就是腳本調用表單對象的submit()方法。我以前在編寫一個用於實驗的ajax例子時就在這裏出現過問題。對於用form表單提交數據時，若是要用到ajax數據，那麼必定不要用<input type="submit" ......>這個標籤，由於這樣就會用到submit()方法，因此當用戶點擊這個按鈕時頁面就會刷新，最後你就不不會看到你想看到的效果了。）

AJAX = 異步 JavaScript 和 XML，XMLHttpRequest 是 AJAX 的基礎，因此在用到ajax時離不開XMLHttpRequest()對象。對於不一樣的瀏覽器，在建立XMLHttpRequerst()對象的時候是有不一樣的，由於不一樣的瀏覽器不必定支持同一種XMLHttpRequerst對象，（額，固然用JQuery時能夠避免這樣的問題，不會像js同樣在建立XMLHttpRequerst對象時先要通過各類嘗試再才能建立XMLHttpRequerst對象。其實對於如今大多數的瀏覽器都是支持XMLHttpRequerst對象的，特例就是微軟的ie5和ie6，也就不吐槽在編寫兼容這兩個瀏覽器時html文本的複雜程度了。

 

這段代碼就是我編寫的一個練手的js代碼，10-17行就是用來建立XMLHttpRequerst對象，ActiveXObject()就是用來建立兼容ie五、ie6的XMLHttpRequerst對象，這裏要注意ActiveXObject的倉鼠是一個字符串。（而對於ActiveXObject的東西http://bbs.csdn.net/topics/290067208，這個連接也許能夠向你說清楚。）而後就是對於XMLHttpRequerst對象的幾個方法的說明了。上邊的代碼中第十八行，就是獲取form表單中的文本輸入欄中的內容，這個我以前不知道因此就用了submit（）方法來獲取表單的內容，也就是由於這個我發現頁面老是刷新並且得不到我想要的效果，後臺才發現了這個問題，以後我將submit（）換成了一個button，再經過18行的那一句代碼，就能夠獲取我想要的表單數據了（這也反映出其實我學習js程度太淺，只是知其皮毛而已。。。。。。。）。再就是XMLHttpRequerst對象的幾個方法，首先是open（），open（）的參數有三個，第一個參數用來聲明向服務器發起請求的方式，，第二個是告訴服務器請求文件的地址，第三個是用來講明是同步傳輸仍是異步傳輸。對於get方法比較簡單，並且不須要在http報文中寫入數據，因此後面的sent（）方法的參數能夠省略，而對於post方法，要向請求http報文中寫入數據，因此sent（）方法的參數就要寫了。這裏也就順便把sent（）方法說了，sent（）方法用來發起一次請求，他有一個可選參數，get方法時不用寫，post方法是要寫入要經過post方法傳遞什麼要的信息。一般是以名值對的形式出現。還有就是在以post方法請求時第20行的代碼必須寫，要保證能夠修改http報文。再就是onreadystate（），當請求被髮送到服務器時，咱們須要執行一些基於響應的任務。每當 readyState 改變時，就會觸發 onreadystatechange 事件。而readyState有5個狀態值，分別是0、一、二、三、4，他們分別表明請求爲初始化、服務器鏈接創建、請求接收、請求已處理、請求已結束且響應已就緒，注意在時間的驗證過程當中可能在審查元素中發現readyState值一直都不是4，或者總停在某一個狀態值上，只多是因爲網速的問題，我以前就一直出現這樣的問題，這時你不妨試試，把open（）方法的第三個參數改爲True，就是改爲同步，這樣也許就能夠解決了，由於我就是這樣解決的。XMLHttpRequerst的兩個屬性readyState和status，readyState已經介紹過了，status就是用來代表請求的狀態值，和普通網頁http請求的狀態值同樣，可能有200、40四、502等等狀態。額，這些就是對ajax的一個初步的瞭解，這些也是js中應用ajax的一些總結，固然若是你用jQuery應用ajax是你會發現，會簡單的多，語句更少更簡單卻能夠實現和js同樣的功能，你們有興趣的能夠去w3cschool學習一下，難度並非很大。還有就是在用js應用ajax時，你們必定要對js有必定程度的瞭解，不然會有不少地方不明白。

嗯，以上就是我學習的大概過程和體會了，若是你們對ajax頗有興趣的話我向你們推薦一本書《Ajax Hacks》這本書從底層講起，介紹ajax的各類原理和內容，不過至關貴，網上也沒有電子檔。。。。因此你們有興趣能夠買一原本看看，必定會有很大的收穫。