本文主要總結(jié)整理Ajax的一些常用的基礎(chǔ)知識胸嘴，適合初學(xué)者队萤。

一下愈、Ajax簡介、優(yōu)劣勢署拟、應(yīng)用場景以及技術(shù)

• Ajax簡介 :

  • Asynchronous Javascript And XML （異步的
    JavaScript和XML）
  • 它并不是一種單一的技術(shù)婉宰，而是有機利用一系列交互式網(wǎng)頁應(yīng)用相關(guān)的技術(shù)所形成的結(jié)合體
  • AJAX 是一種用于創(chuàng)建快速動態(tài)網(wǎng)頁的技術(shù)。通過在后臺與服務(wù)器進行少量數(shù)據(jù)交換推穷，AJAX 可以使網(wǎng)頁實現(xiàn)異步更新心包。這意味著可以在不重新加載整個網(wǎng)頁的情況下，對網(wǎng)頁的某部分進行更新馒铃。

• 優(yōu)點：

  • 頁面無刷新蟹腾，用戶體驗好。
  • 異步通信骗露，更加快的響應(yīng)能力岭佳。
  • 減少冗余請求，減輕了服務(wù)器負(fù)擔(dān)
  • 基于標(biāo)準(zhǔn)化的并被廣泛支持的技術(shù)萧锉，不需要下載插件或者小程序

• 缺點：

  • ajax干掉了back按鈕珊随，即對瀏覽器后退機制的破壞。
  • 存在一定的安全問題。
  • 對搜索引擎的支持比較弱叶洞。
  • 破壞了程序的異常機制鲫凶。
  • 無法用URL直接訪問

• ajax應(yīng)用場景

  • 場景 1. 數(shù)據(jù)驗證
  • 場景 2. 按需取數(shù)據(jù)
  • 場景 3. 自動更新頁面

• AJAX 包含以下五個部分：
  ajax并非一種新的技術(shù)，而是幾種原有技術(shù)的結(jié)合體衩辟。它由下列技術(shù)組合而成螟炫。

  • 使用CSS和XHTML來表示。
  • 使用DOM模型來交互和動態(tài)顯示艺晴。
  • 數(shù)據(jù)互換和操作技術(shù)昼钻，使用XML與XSLT
  • 使用XMLHttpRequest來和服務(wù)器進行異步通信。
  • 使用javascript來綁定和調(diào)用封寞。

在上面幾中技術(shù)中然评，除了XmlHttpRequest對象以外，其它所有的技術(shù)都是基于web標(biāo)準(zhǔn)并且已經(jīng)得到了廣泛使用的狈究，XMLHttpRequest雖然目前還沒有被W3C所采納碗淌，但是它已經(jīng)是一個事實的標(biāo)準(zhǔn)，因為目前幾乎所有的主流瀏覽器都支持它

image

• 第一張圖尤其說明了傳統(tǒng)Web 應(yīng)用程序的結(jié)構(gòu)與采用了 AJAX 技術(shù)的 Web
  應(yīng)用程序的結(jié)構(gòu)上的差別
• 主要的差別抖锥，其實不是 JavaScript亿眠，不是 HTML/XHTML和 CSS，而是采用
  了 XMLHttpRequest 來向服務(wù)器異步的請求 XML 數(shù)據(jù)

image

• 再來看第二張圖磅废，傳統(tǒng)的 Web 應(yīng)用模式纳像，用戶的體驗是割裂的，點擊->等待->
  看到新的頁面->再點擊->再等待还蹲。而采用了AJAX技術(shù)之后爹耗，大部分的計算工作，都是在用戶不察覺的情況下谜喊，交由服務(wù)器去完成了

image

image

二潭兽、創(chuàng)建ajax的步驟

Ajax的原理簡單來說通過XmlHttpRequest對象來向服務(wù)器發(fā)異步請求，從服務(wù)器獲得數(shù)據(jù)斗遏，然后用javascript來操作DOM而更新頁面山卦。這其中最關(guān)鍵的一步就是從服務(wù)器獲得請求數(shù)據(jù)。原生創(chuàng)建ajax可分為以下四步

1诵次、創(chuàng)建XMLHttpRequest對象

Ajax的核心是XMLHttpRequest對象账蓉，它是Ajax實現(xiàn)的關(guān)鍵，發(fā)送異步請求逾一、接受響應(yīng)以及執(zhí)行回調(diào)都是通過它來完成

所有現(xiàn)代瀏覽器（IE7+铸本、Firefox、Chrome遵堵、Safari 以及 Opera）均內(nèi)建 XMLHttpRequest 對象箱玷。

• 創(chuàng)建 XMLHttpRequest對象的語法：

var xhr = new XMLHttpRequest();

• 老版本的 Internet Explorer（IE5 和 IE6）使用ActiveX 對象：

var xhr = new ActiveXObject("Microsoft.XMLHTTP");

為了應(yīng)對所有的現(xiàn)代瀏覽器怨规，包括 IE5 和 IE6，請檢查瀏覽器是否支持 XMLHttpRequest對象锡足。如果支持波丰，則創(chuàng)建XMLHttpRequest對象。如果不支持舶得，則創(chuàng)建ActiveXObject：

• 兼容各個瀏覽器的創(chuàng)建Ajax的工具函數(shù)

function createRequest (){
    try {
        xhr = new XMLHttpRequest();
    }catch (tryMS){
        try {
            xhr = new ActiveXObject("Msxm12.XMLHTTP");
        } catch (otherMS) {
            try {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }catch (failed) {
                xhr = null;
            }
        }
    }
    return xhr;
}

2掰烟、準(zhǔn)備請求

• 初始化該XMLHttpRequest對象，接受三個參數(shù)：

xhr.open(method,url,async);

• 第一個參數(shù)表示請求類型的字符串沐批，其值可以是GET或者POST纫骑。
• GET請求：

xhr.open("GET",demo.php?name=tsrot&age=24,true);

• POST請求：

xhr.open("POST",demo.php,true);

• 第二個參數(shù)是要作為請求發(fā)送目標(biāo)的URL。
• 第三個參數(shù)是true或false珠插，表示請求是以異步還是同步的模式發(fā)出惧磺。（默認(rèn)為true，一般不建議為false）
  • false：同步模式發(fā)出的請求會暫停所有javascript代碼的執(zhí)行捻撑，知道服務(wù)器獲得響應(yīng)為止，如果瀏覽器在連接網(wǎng)絡(luò)時或者在下載文件時出了故障缤底，頁面就會一直掛起顾患。
  • true：異步模式發(fā)出的請求，請求對象收發(fā)數(shù)據(jù)的同時个唧，瀏覽器可以繼續(xù)加載頁面江解，執(zhí)行其他javascript代碼

3、發(fā)送請求

xhr.send();

一般情況下徙歼，使用Ajax提交的參數(shù)多是些簡單的字符串犁河，可以直接使用GET方法將要提交的參數(shù)寫到open方法的url參數(shù)中徘禁，此時send方法的參數(shù)為null或為空侧到。

• GET請求：

xhr.open("GET",demo.php?name=tsrot&age=24,true);
xhr.send(null);

• POST請求：
  如果需要像 HTML 表單那樣 POST 數(shù)據(jù)，請使用 setRequestHeader()來添加 HTTP 頭佛南。然后在send()方法中規(guī)定您希望發(fā)送的數(shù)據(jù)：

xhr.open("POST",demo.php,true);
xhr.setRequestHeder("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
xhr.sen

4酿秸、處理響應(yīng)

xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        console.log(xhr.responseText);
    }
}

• onreadystatechange ：當(dāng)處理過程發(fā)生變化的時候執(zhí)行下面的函數(shù)

• readyState ：ajax處理過程

  • 0：請求未初始化（還沒有調(diào)用 open()）灭翔。
  • 1：請求已經(jīng)建立，但是還沒有發(fā)送（還沒有調(diào)用 send()）辣苏。
  • 2：請求已發(fā)送肝箱，正在處理中（通常現(xiàn)在可以從響應(yīng)中獲取內(nèi)容頭）稀蟋。
  • 3：請求在處理中煌张；通常響應(yīng)中已有部分?jǐn)?shù)據(jù)可用了，但是服務(wù)器還沒有完成響應(yīng)的生成退客。
  • 4：響應(yīng)已完成骏融；您可以獲取并使用服務(wù)器的響應(yīng)了。

• status屬性：

  • 200:"OK"
  • 404: 未找到頁面

• responseText：獲得字符串形式的響應(yīng)數(shù)據(jù)

• responseXML：獲得 XML形式的響應(yīng)數(shù)據(jù)

• 對象轉(zhuǎn)換為JSON格式使用JSON.stringify

• json轉(zhuǎn)換為對象格式用JSON.parse()

• 返回值一般為json字符串，可以用JSON.parse(xhr.responseText)轉(zhuǎn)化為JSON對象

• 從服務(wù)器傳回的數(shù)據(jù)是json格式绎谦，這里做一個例子說明管闷，如何利用

  • 1、首先需要從XMLHttpRequest對象取回數(shù)據(jù)這是一個JSON串窃肠，把它轉(zhuǎn)換為真正的JavaScript對象包个。使用JSON.parse(xhr.responseText)轉(zhuǎn)化為JSON對象
  • 2、遍歷得到的數(shù)組冤留，向DOM中添加新元素

function example(responseText){

var saleDiv= document.getElementById("sales");
var sales = JSON.parse(responseText);
    for(var i=0;i<sales.length;i++){
        var sale = sales[i];
         var div = document.createElement("div");
         div.setAttribute("class","salseItem");
        div.innerHTML = sale.name + sale.sales;
        salseDiv.appendChild(div);
    }
}

image

5碧囊、封裝例子

• 將AJAX請求封裝成ajax()方法，它接受一個配置對象params

function ajax(params) {   
  params = params || {};   
  params.data = params.data || {};   
  // 判斷是ajax請求還是jsonp請求
  var json = params.jsonp ? jsonp(params) : json(params);   
  // ajax請求   
  function json(params) {   
    //  請求方式纤怒，默認(rèn)是GET
    params.type = (params.type || 'GET').toUpperCase(); 
    // 避免有特殊字符糯而，必須格式化傳輸數(shù)據(jù)  
    params.data = formatParams(params.data);   
    var xhr = null;    

    // 實例化XMLHttpRequest對象   
    if(window.XMLHttpRequest) {   
      xhr = new XMLHttpRequest();   
    } else {   
      // IE6及其以下版本   
      xhr = new ActiveXObjcet('Microsoft.XMLHTTP');   
    }; 

• 使用實例：

ajax({   
  url: 'test.php',   // 請求地址
  type: 'POST',   // 請求類型，默認(rèn)"GET"泊窘，還可以是"POST"
  data: {'b': '異步請求'},   // 傳輸數(shù)據(jù)
  success: function(res){   // 請求成功的回調(diào)函數(shù)
    console.log(JSON.parse(res));   
  },
  error: function(error) {}   // 請求失敗的回調(diào)函數(shù)
});

• 這個過程是一定要記在腦子里的

function ajax(url, success, fail){
    // 1\. 創(chuàng)建連接
    var xhr = null;
    xhr = new XMLHttpRequest()
    // 2\. 連接服務(wù)器
    xhr.open('get', url, true)
    // 3\. 發(fā)送請求
    xhr.send(null);
    // 4\. 接受請求
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4){
            if(xhr.status == 200){
                success(xhr.responseText);
            } else { // fail
                fail && fail(xhr.status);
            }
        }
    }
}

image

談?wù)凧SONP

• 要訪問web服務(wù)器的數(shù)據(jù)除了XMLHttpRequest外還有一種方法是JSONP

• 如果HTML和JavaScript與數(shù)據(jù)同時在同一個機器上熄驼，就可以使用XMLHttpRequest

• 什么是JSONP？

  • JSONP(JSON with Padding)是一個非官方的協(xié)議烘豹，它允許在服務(wù)器端集成Script tags返回至客戶端瓜贾，通過javascript callback的形式實現(xiàn)跨域訪問（這僅僅是JSONP簡單的實現(xiàn)形式）

• JSONP有什么用？

  • 由于同源策略的限制携悯，XmlHttpRequest只允許請求當(dāng)前源（域名祭芦、協(xié)議、端口）的資源憔鬼，為了實現(xiàn)跨域請求龟劲，可以通過script標(biāo)簽實現(xiàn)跨域請求，然后在服務(wù)端輸出JSON數(shù)據(jù)并執(zhí)行回調(diào)函數(shù)轴或，從而解決了跨域的數(shù)據(jù)請求

• 如何使用JSONP昌跌？

  • 在客戶端聲明回調(diào)函數(shù)之后，客戶端通過script標(biāo)簽向服務(wù)器跨域請求數(shù)據(jù)侮叮，然后服務(wù)端返回相應(yīng)的數(shù)據(jù)并動態(tài)執(zhí)行回調(diào)函數(shù)

• 用XMLHttpRequest時避矢，我們得到一個字符串；要用JSON.parse把字符串轉(zhuǎn)化成對象囊榜，使用jsonp時审胸，script標(biāo)志會解析并執(zhí)行返回的代碼，等我們處理數(shù)據(jù)時卸勺，已經(jīng)是一個JavaScript對象了

• 簡單實例

<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />  
<script type="text/javascript">  
    function jsonpCallback(result) {  
        alert(result.a);  
        alert(result.b);  
        alert(result.c);  
        for(var i in result) {  
            alert(i+":"+result[i]);//循環(huán)輸出a:1,b:2,etc.  
        }  
    }  
</script>  
<script type="text/javascript" src="http://crossdomain.com/services.php?callback=jsonpCallback"></script>  
<!--callback參數(shù)指示生成JavaScript代碼時要使用的函數(shù)jsonpcallback-->

• 注意瀏覽器的緩存問題
  • 在末尾增加一個隨機數(shù)可避免頻繁請求同一個鏈接出現(xiàn)的緩存問題
  • `<script type="text/javascript" src="http://crossdomain.com/services.php?callback=jsonpCallback&random=(new Date()).getTime()"></script>

原生JavaScript實現(xiàn)完整的Ajax砂沛、JSONP例子

function ajax(params) {
    params = params || {};
    params.data = params.data || {};
    var json = params.jsonp ? jsonp(params) : json(params);
    // ajax請求
    function json(params) {
        params.type = (params.type || 'GET').toUpperCase();
        params.data = formatParams(params.data);
        var xhr = null;

        // 實例化XMLHttpRequest對象
        if(window.XMLHttpRequest) {
            xhr = new XMLHttpRequest();
        } else {
            // IE6及其以下版本
            xhr = new ActiveXObjcet('Microsoft.XMLHTTP');
        };

        // 監(jiān)聽事件
        xhr.onreadystatechange = function() {
            if(xhr.readyState == 4) {
                var status = xhr.status;
                if(status >= 200 && status < 300) {
                    var response = '';
                    var type = xhr.getResponseHeader('Content-type');
                    if(type.indexOf('xml') !== -1 && xhr.responseXML) {
                        response = xhr.responseXML; //Document對象響應(yīng)
                    } else if(type === 'application/json') {
                        response = JSON.parse(xhr.responseText); //JSON響應(yīng)
                    } else {
                        response = xhr.responseText; //字符串響應(yīng)
                    };
                    params.success && params.success(response);
                } else {
                    params.error && params.error(status);
                }
            }
        };

        // 連接和傳輸數(shù)據(jù)
        if(params.type == 'GET') {
            xhr.open(params.type, params.url + '?' + params.data, true);
            xhr.send(null);
        } else {
            xhr.open(params.type, params.url, true);
            //設(shè)置提交時的內(nèi)容類型
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
            xhr.send(params.data);
        }
    }

    // jsonp請求
    function jsonp(params) {
        //創(chuàng)建script標(biāo)簽并加入到頁面中
        var callbackName = params.jsonp;
        var head = document.getElementsByTagName('head')[0];
        // 設(shè)置傳遞給后臺的回調(diào)參數(shù)名
        params.data['callback'] = callbackName;
        var data = formatParams(params.data);
        var script = document.createElement('script');
        head.appendChild(script);

        //創(chuàng)建jsonp回調(diào)函數(shù)
        window[callbackName] = function(json) {
            head.removeChild(script);
            clearTimeout(script.timer);
            window[callbackName] = null;
            params.success && params.success(json);
        };

        //發(fā)送請求
        script.src = params.url + '?' + data;

        //超時處理
        if(params.time) {
            script.timer = setTimeout(function() {
                window[callbackName] = null;
                head.removeChild(script);
                params.error && params.error({
                    message: '超時'
                });
            }, time);
        }
    };
    //格式化參數(shù)
    function formatParams(data) {
        var arr = [];
        for(var name in data) {
            arr.push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name]));
        };
        // 添加一個隨機數(shù)，防止緩存
        arr.push('v=' + random());
        return arr.join('&');
    }
    // 獲取隨機數(shù)
    function random() {
        return Math.floor(Math.random() * 10000 + 500);
    }
}

• 使用

ajax({
                url: 'get.php',
                type: 'GET',
                data: {'intro': 'get請求'},
                success:function(res){
                    res = JSON.parse(res);
                    document.getElementById('a').innerHTML = res.intro;
                    console.log(res);
                }
            });
        ajax({
                url: 'post.php',
                type: 'POST',
                data: {'intro': 'post請求'},
                success:function(res){
                    res = JSON.parse(res);
                    document.getElementById('b').innerHTML = res.intro;
                    console.log(res);
                }
            });
        ajax({
                url: 'http://music.qq.com/musicbox/shop/v3/data/hit/hit_all.js',
                jsonp: 'jsonpCallback',
                data: {'callback': 'jsonpCallback'},
                success:function(res){
                    JsonCallback(json);
                }
            });

下面我們就根據(jù)以上 封裝的例子跨域獲取qq音樂的數(shù)據(jù)

• 在線演示--跨域獲取qq音樂的數(shù)據(jù)

下面的方法也可以實現(xiàn)

• 使用jQuery實現(xiàn)

<script src="jquery-3.1.0.min.js"></script>
        <script type="text/javascript">

            $.ajax({
                  type: "get",
                  async: false,
                  url: "http://music.qq.com/musicbox/shop/v3/data/hit/hit_all.js",
                  dataType: "jsonp",
                  jsonp: "callback",
                  jsonpCallback: "JsonCallback",
                  scriptCharset: 'GBK',//設(shè)置編碼曙求，否則會亂碼
                  success: function(data) {
                    //var result = JSON.stringify(data);
                      JsonCallback(data);
                  },
                  error: function() {
                    alert('fail');
                  }
                });
            function JsonCallback(json){
                var data = json.songlist;
                var html = '';
                for (var i=0;i<data.length;i++) {
                    document.write(data[i].url+"<br>");
                }

            }
        </script>

• 原生js簡潔實現(xiàn)

var script = document.createElement("script");
            script.src = 'http://music.qq.com/musicbox/shop/v3/data/hit/hit_all.js?callback=JsonCallback';
            document.body.appendChild(script);

            function JsonCallback(json){
                var data = json.songlist;
                var html = '';
                for (var i=0;i<data.length;i++) {
                    console.log(data[i]);
                }

            }

三碍庵、 jQuery中的Ajax

• jQuery中的ajax封裝案例

//ajax請求后臺數(shù)據(jù)
var btn =  document.getElementsByTagName("input")[0];
btn.onclick = function(){

    ajax({//json格式
        type:"post",
        url:"post.php",
        data:"username=poetries&pwd=123456",
        asyn:true,
        success:function(data){
            document.write(data);
        }
    });
}
//封裝ajax
function ajax(aJson){
    var ajx = null;
    var type = aJson.type || "get";
    var asyn = aJson.asyn || true;
    var url = aJson.url;        // url 接收 傳輸位置
    var success = aJson.success;// success 接收 傳輸完成后的回調(diào)函數(shù)
    var data = aJson.data || '';// data 接收需要附帶傳輸?shù)臄?shù)據(jù)

    if(window.XMLHttpRequest){//兼容處理
        ajx = new XMLHttpRequest();//一般瀏覽器
    }else
    {
        ajx = new ActiveXObject("Microsoft.XMLHTTP");//IE6+
    }
    if (type == "get" && data)
    {
        url +="/?"+data+"&"+Math.random();
    }

    //初始化ajax請求
    ajx.open( type , url , asyn );
    //規(guī)定傳輸數(shù)據(jù)的格式
    ajx.setRequestHeader('content-type','application/x-www-form-urlencoded');
    //發(fā)送ajax請求（包括post數(shù)據(jù)的傳輸）
    type == "get" ?ajx.send():ajx.send(aJson.data);

    //處理請求
    ajx.onreadystatechange = function(aJson){

    if(ajx.readState == 4){

        if (ajx.status == 200 && ajx.status<300)//200是HTTP 請求成功的狀態(tài)碼
        {
            //請求成功處理數(shù)據(jù)
            success && success(ajx.responseText);
        }else{
            alert("請求出錯"+ajx.status);

        }
    }

    }

jQuery中的Ajax的一些方法

jquery對Ajax操作進行了封裝映企，在jquery中的$.ajax()方法屬于最底層的方法，第2層是load()静浴、$.get()堰氓、$.post();第3層是$.getScript()、$.getJSON()苹享，第2層使用頻率很高

load()方法

• load()方法是jquery中最簡單和常用的ajax方法双絮，能載入遠(yuǎn)程HTML代碼并插入DOM中 結(jié)構(gòu)為：load(url,[data],[callback])
• 使用url參數(shù)指定選擇符可以加載頁面內(nèi)的某些元素 load方法中url語法：url selector 注意：url和選擇器之間有一個空格
• 傳遞方式
  • load()方法的傳遞方式根據(jù)參數(shù)data來自動指定，如果沒有參數(shù)傳遞得问，則采用GET方式傳遞囤攀，反之，采用POST
• 回調(diào)參數(shù)
  • 必須在加載完成后才執(zhí)行的操作宫纬，該函數(shù)有三個參數(shù) 分別代表請求返回的內(nèi)容焚挠、請求狀態(tài)、XMLHttpRequest對象
  • 只要請求完成漓骚，回調(diào)函數(shù)就會被觸發(fā)

$("#testTest").load("test.html",function(responseText,textStatus,XMLHttpRequest){
    //respnoseText 請求返回的內(nèi)容
    //textStatus 請求狀態(tài) ：sucess蝌衔、error、notmodified蝌蹂、timeout
    //XMLHttpRequest 
})

• load方法參數(shù)

$.get()和$.post()方法

load()方法通常用來從web服務(wù)器上獲取靜態(tài)的數(shù)據(jù)文件。在項目中需要傳遞一些參數(shù)給服務(wù)器中的頁面叉信，那么可以使用$.get()和$.post()或$.ajax()方法

• 注意：$.get()和$.post()方法是jquery中的全局函數(shù)

• $.get()方法

  • $.get()方法使用GET方式來進行異步請求
  • 結(jié)構(gòu)為：$.get(url,[data],callback,type)
    • 如果服務(wù)器返回的內(nèi)容格式是xml文檔，需要在服務(wù)器端設(shè)置Content-Type類型 代碼如下：header("Content-Type:text/xml:charset=utf-8") //php

• $.get()方法參數(shù)解析

• $.post()方法

  • 它與$.get()方法的結(jié)構(gòu)和使用方式相同，有如下區(qū)別
    • GET請求會將參數(shù)跟張乃URL后進行傳遞撒顿，而POST請求則是作為Http消息的實體內(nèi)容發(fā)送給web服務(wù)器丑罪，在ajax請求中，這種區(qū)別對用戶不可見
    • GET方式對傳輸數(shù)據(jù)有大小限制（通常不能大于2KB）凤壁，而使用POST方式傳遞的數(shù)據(jù)量要比GET方式大得多（理論不受限制）
    • GET方式請求的數(shù)據(jù)會被瀏覽器緩存起來吩屹，因此其他人可以從瀏覽器的歷史紀(jì)錄中讀取這些數(shù)據(jù)，如：賬號拧抖、密碼煤搜。在某種情況下，GET方式會帶來嚴(yán)重的安全問題唧席，而POST相對來說可以避免這些問題
    • GET和POST方式傳遞的數(shù)據(jù)在服務(wù)端的獲取也不相同擦盾。在PHP中嘲驾，GET方式用$_GET[]獲取迹卢；POST方式用$_POST[]獲取;兩種方式都可用$_REQUEST[]來獲取

• 總結(jié)

  • 使用load()辽故、$.get()和$.post()方法完成了一些常規(guī)的Ajax程序，如果還需要復(fù)雜的Ajax程序腐碱，就需要用到$.ajax()方式

$.ajax()方法

• $.ajax()方法是jquery最底層的Ajax實現(xiàn)誊垢，它的結(jié)構(gòu)為$.ajax(options)
• 該方法只有一個參數(shù)，但在這個對象里包含了$.ajax()方式所需要的請求設(shè)置以及回調(diào)函等信息喻杈，參數(shù)以key / value存在彤枢，所有參數(shù)都是可選的
• $.ajax()方式常用參數(shù)解析

this;//調(diào)用本次Ajax請求時傳遞的options參數(shù)
} |
| success | Function | 請求成功后調(diào)用的回調(diào)函數(shù)，有兩個參數(shù)<br />(1)由服務(wù)器返回焕檬，并根據(jù)dataTyppe參數(shù)進行處理后的數(shù)據(jù)<br />(2)描述狀態(tài)的字符串<br />function(data,textStatus){
//data可能是xmlDoc姆坚、``jsonObj、html实愚、text等
this;//調(diào)用本次Ajax請求時傳遞的options參數(shù)<br />} |
| error | Function | 請求失敗時被調(diào)用的函數(shù) |
| global | Boolean | 默認(rèn)為true兼呵。表示是否觸發(fā)全局Ajax事件，設(shè)置為false將不會觸發(fā)腊敲。AjaxStart或AjaxStop可用于控制各種Ajax事件 |

鏈接：http://www.reibang.com/p/c94e49772123