JQuery AJAX 方法總結：

JQuery中主要AJax方法： 

1、load:

$(selector).load(url,[data],[callback]);從服務器中加載數據並將返回數據放入被選元素中。

參數含義：

url ： 爲但願加載URL，能夠將JQuery的選擇器添加到URL參數中。

data：爲請求傳入的參數，爲鍵值對

callback ：success(data,status,xhr)  （請求成功時才調用回調函數，失敗的處理須要使用ajax函數）

     data:包含調用成功時的結果內容

    status:爲調用狀態，成功時返回"success"，失敗時返回"error"

    xhr:返回XMLHttpRequest對象,根據該對象可獲取 readyState 和 statues

經過查看源碼可知load 的本質是經過ajax方法來實現，默認爲GET方法，若是第二個參數params爲函數則用GET方法，若是爲對象則爲POST方法。

例：

1.function handleclick()
{
   $("#responsediv").load("server.php",function(responsTxt,statusTxt,xhr){
       if(statusTxt === "error")
            this.innerHTML="Error!";
     });
} 

發送方式爲GET：

2.function handleclick()
{
   $("#responsediv").load("server.php",{"name":"LH"},function(responsTxt,statusTxt,xhr){
       if(statusTxt === "error")
            this.innerHTML="Error!";
     });
} 

發送方式爲POST：

JQuery load函數源碼以下:

jQuery.fn.load = function( url, params, callback ) {
     if ( typeof url !== "string" && _load ) {
          return _load.apply( this, arguments );
     }

     var selector, type, response,
          self = this,
          off = url.indexOf(" ");
     if ( off >= 0 ) {
          selector = jQuery.trim( url.slice( off ) );
          url = url.slice( 0, off );
     }

     // If it's a function
     if ( jQuery.isFunction( params ) ) {

          // We assume that it's the callback
          callback = params;
          params = undefined;

     // Otherwise, build a param string
     } else if ( params && typeof params === "object" ) {
          type = "POST";
     }

     // If we have elements to modify, make the request
     if ( self.length > 0 ) {
          jQuery.ajax({
               url: url,
               // if "type" variable is undefined, then "GET" method will be used
               type: type,
               dataType: "html",
               data: params
          }).done(function( responseText ) {

               // Save response for use in complete callback
               response = arguments;

               self.html( selector ?

                    // If a selector was specified, locate the right elements in a dummy div
                    // Exclude scripts to avoid IE 'Permission Denied' errors
                    jQuery("<div>").append( jQuery.parseHTML( responseText ) ).find( selector ) :

                    // Otherwise use the full result
                    responseText );

          }).complete( callback && function( jqXHR, status ) {
               self.each( callback, response || [ jqXHR.responseText, status, jqXHR ] );
          });
     }

     return this;
};

二,$.get() 和 $.post()

get:

$.get(URL,[data],[callback],[type]); 經過HTTP GET 方法從服務器上請求數據。

參數：

URL：請求頁面的URL地址

data: 請求參數，這裏的參數會加在http請求頭url後面

callback：回調函數，回調函數的3個參數:success(data,status,xhr) （請求成功時才調用回調函數，失敗的處理須要使用ajax函數）

type: 請求返回數據轉化成該數據類型

post:

$.post(URL,[data],[callback],[type]);經過HTTP POST 方法從服務器上請求數據。

參數：

URL：請求頁面的URL地址

data: 請求參數，這裏的參數放在http報文裏面。

callback：回調函數，回調函數的3個參數:success(data,status,xhr)（請求成功時才調用回調函數，失敗的處理須要使用ajax函數）

type: 請求返回數據轉化成該數據類型

GET和POST JQuery源碼：

jQuery.each( [ "get", "post" ], function( i, method ) {
     jQuery[ method ] = function( url, data, callback, type ) {
          // shift arguments if data argument was omitted
          if ( jQuery.isFunction( data ) ) {
               type = type || callback;
               callback = data;
               data = undefined;
          }

          return jQuery.ajax({
               url: url,
               type: method,
               dataType: type,
               data: data,
               success: callback
          });
     };
});

get 和 post 區別：

請求靜態頁面時，get請求瀏覽器會將數據緩存，post不會緩存

3、getJSON和getScript

getJSON:

 $.getJSON(url,[data],[callback]); 經過HTTP GET 請求載入JSON數據。

參數：

url：請求頁面地址

data：請求參數

callback:回調函數,success(data,status,xhr)（請求成功時才調用回調函數，失敗的處理須要使用ajax函數）

JQuery 源碼：

     getJSON: function( url, data, callback ) {
          return jQuery.get( url, data, callback, "json" );
     }

getScript：

$.getScript(url,[callback]); 經過HTTP GET請求載入js腳本，並在加載完畢以後執行這個腳本

參數：

url:請求連接

callback:回調函數，success(data,status,xhr)（請求成功時才調用回調函數，失敗的處理須要使用ajax函數）

JQuery 源碼：

      getScript: function( url, callback ) {
          return jQuery.get( url, undefined, callback, "script" );
     }

用getScript加載腳本的優勢：

正如她的特色同樣，優勢很明顯，那就是異步請求，在頁面快速載入1KB的基本js以後，而後分段依次載入100KB的腳本，固然這是假設狀況。咱們熟悉的QQ空間就是利用這樣的原理，一步一步的部署運行環境的，可以減小客戶端的壓力，而且頁面的呈現不會由於js龐大而戛然而止或者止步不前。

缺點：

加劇客戶端對服務端的請求次數;

4、Ajax

$.ajax([setting]); JQuery ajax 的基礎函數，從以前的JQuery 源碼能夠看出get,post,load本質都是調用ajax()函數來實現的。

參數所有爲可選：

1.數據參數：

url：請求的頁面地址，默認值爲當前頁面地址

type:http請求類型 GET/POST

data:鍵值對，來傳遞請求參數

async:默認爲true，異步請求，false爲同步請求

dataType:服務器返回數據的數據類型。若是不指定，jQuery 自動根據HTTP 包MIME信息來智能判斷

• "xml": 返回 XML 文檔，可用 jQuery 處理。

• "html": 返回純文本 HTML 信息；包含的 script 標籤會在插入 dom 時執行。

• "script": 返回純文本 JavaScript 代碼。不會自動緩存結果。除非設置了 "cache" 參數。注意：在遠程請求時(不在同一個域下)，全部 POST 請求都將轉爲 GET 請求。（由於將使用 DOM 的 script標籤來加載）

• "json": 返回 JSON 數據 。

• "jsonp": JSONP 格式。使用 JSONP 形式調用函數時，如 "myurl?callback=?" jQuery 將自動替換 ? 爲正確的函數名，以執行回調函數。

• "text": 返回純文本字符串

2.回調函數:

beforeSend:發送請求以前調用，XMLHttpRequest對象爲惟一參數，通常可在發送請求以前修改XMLHttpRequest對象，如添加自定義HTTP頭。

error:  請求失敗時調用 參數有三個：XMLHttpRequset對象，錯誤信息，（可選）捕獲的異常對象。

dataFilter:在請求成功以後調用。傳入返回的數據以及 "dataType" 參數的值。傳遞給 success 回調函數。

success:請求成功後的回調函數，參數有3個：根據 dataType 參數進行處理後的數據，描述狀態的字符串，XMLHttpRequest對象。

complete:請求完成後回調函數 (請求成功或失敗以後均調用)。參數爲XMLHttpRequest 對象和一個描述請求類型的字符串。