JQuery中Ajax應用

1 定義:客戶端js發起的http請求的代號 無刷新的數據更新(不能跨域訪問)

2 使用:高復發
　　同步代碼:按鈕按下==>>執行耗時操做==>>等待執行返回 解決方案(使用多線程)
　　異步代碼:按鈕按下==>>執行耗時操做==>>不等待執行返回

3 優缺點

　　優勢:

　　　　兼容性好(無需插件,瀏覽器只須要支持js便可)
　　　　用戶體驗好(不更新頁面的前提下維護數據,提升了應用程序的效率)
　　　　提升了web程序的性能(傳統:使用表單提交數據,靠刷新頁面來獲取信息,ajax:經過xmlhttprequest提交,按需發送)
　　　　減輕服務器和帶寬負擔(將某些服務器負擔轉移到客戶端,便於客戶端資源來處理)
　　缺點:

　　　　可能破壞瀏覽器的後退按鈕的正常行爲
　　　　對搜索引擎的支持不足
　　　　開發調試工具缺少
　　　　手持設備支持性差

4 XMLHttpRequest對象

　　屬性:

　　　　 readyState:http請求狀態 從0開始到4結束
　　　　responseText:響應體,不包括頭
　　　　responseXML:響應請求,解析爲xml,做爲document返回
　　　　status:http狀態碼

　　方法:

　　　　abort():取消當前響應,關閉鏈接並結束未決網絡活動
　　　　getAllRespomseHeaders():把http響應頭做爲未解析字符串返回
　　　　getResponseHeader():http響應頭的值
　　　　open():初始化http請求的參數
　　語法:

　　　　open(method,url,async,username,password)
　　　　method:請求的方法 
　　　　url:請求的地址
　　　　async:是否異步 true/false 
　　　　username/password:可選參數,保證服務安全
　　　　send(body):發送http請求,傳遞open()方法的參數
　　　　setRequestHeader():向一個打開但未發送的請求設置或添加http請求

　　事件:onreadystatechange

5 JavaScript中Ajax

　　建立過程:httpRequest請求對象==>>打開鏈接==>>監控狀態==>>發送請求
　　js中文件域不一樣解決方案:將Ajax文件移到同一個服務器中
　　侷限:js中的http請求不能跨域

6 jQuery中Ajax

　　發展
　　　　1) $.ajax()
　　　　2) load(),$.get(),$.post()
　　　　3) $.getScript(),$.getJson()

　　load(url,[data],[callback])
　　　　1) 加載制定html文件
　　　　2) 篩選載入的html文檔 語法:load(url selector)
　　　　3) 傳遞方式 根據data自動指定
　　　　4) 回調參數:不管請求是否成功,當請求完成後回調函數就被觸發

　　jQuery.get()與jQuery.post()
　　　　$.ajax(options)
　　　　　　參數
　　　　　　　　url:發送請求地址
　　　　　　　　type:請求方式(get/post)
　　　　　　　　timeout:設置請求超時時間
　　　　　　　　data:數據
　　　　　　　　dataType:服務器返回的數據
　　　　　　　　beforeSend(xmr):發送請求前可修改xmlhttprequest對象函數
　　　　　　　　success():請求成功後的回調函數
　　　　　　　　error():請求失敗時調用的函數
　　　　　　　　complete(XHR,TS):請求完成後調用的函數
　　　　　　　　async:請求異步
　　　　　　　　cache:頁面是否緩存
　　JSON
　　　　ajax中數據都是以json方式儲存和傳輸的
　　　　數據以鍵值對的形式存儲

　　序列化元素 　　　　serialize():序列表表格內容爲字符串　　　　serializeArray():序列表表格內容是將dom元素序列化,返回json對象格式的數據　　　　$.param():對數組或對象按鍵值對進行序列化　　　　serialize():序列表表格內容爲字符串　　　　serializeArray():序列表表格內容是將dom元素序列化,返回json對象格式的數據　　　　$.param():對數組或對象按鍵值對進行序列化