概述

ajax 的应用已经非常广泛了，历史就不多说了，有一点大家可能没注意到的是，其实追究起来 ajax 技术是由微软先提供的，好吧，有兴趣的同学可以自己去找找资料，下面我将简要对 jQuery 中的 ajax 技术进行一个概述。

XMLHttpRequest

使用 jquery 之前，我有必要对最原始的 xmlhttprequest 进行一个回顾，使用这个最原始的方法进行一个 ajax 请求，代码应如下：

    <script type=text/javascript>
        function loadXMLDoc()
        {
            var xmlhttp;
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject(Microsoft.XMLHTTP);
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById(myDiv).innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open(GET,/ajax/test1.txt,true);
            xmlhttp.send();
        }
    </script>

原始的 xhr 发起 ajax 请求主要可以分为几个部分：

1. 创建 xmlHttpRequest 对象
2. 创建回调函数（即收到响应后的处理函数）
3. 发起请求

JQuery 的 Ajax

从上面的例子的 3 个步骤中可以看到，首先第一步，创建 xhr 对象，就这个一个简简单单的需求我们用了多少行代码来实现？数数应该是有 6-7 行的，其次是第二步的回调函数，本来就一个处理还是，但是，居然还有判断状态码，代码也有 4-5 行，最后是发起请求，这个是不多了，只有 2 句，但是，为什么不能是一句，甚至于没有呢？

好，接下来就给大家演示一下 jQuery 的 Ajax 请求是怎么实现的，下面上一个例子：

    $.ajax({
        type: GET,
        url: test.json,
        dateType: json,
        success: function(data){
            console.log(success);
        },
        error: function(e) {
            console.log(e.message);
        }
    });

这里大家应该可以猜得出来，这个是请求 test.json 的 ajax 请求，当请求成功之后会打印出 success 请求，失败之后会打印出失败的信息。

$.ajax 是 jQuery 中最底层的 ajax 实现了，此外，jQuery 还在 $.ajax 的基础上封装了 $.get/$.post/$.getJSON/$.load 等请求函数，除此之外，我们使用 ajax 免不了传输数据，这是，jQuery 还给我们提供了表单的序列化函数，$.serialize() 和 $.serializeArray() ,可以帮助我们将表单序列化成字符串和 json 数据结构。