Idle to see the Jquery.ajax source code

Source: Internet
Author: User

The role of the framework is to simplify what we do without losing the flexibility. jquery is the backbone of the JS framework, flexible and powerful.

The encapsulation of Ajax in jquery is perfect and does not say that the underlying AJAX functions are powerful, but the upper layers of Get, post, Getscript, and Getjson are basically good for a variety of applications. Why to see the source code, one is idle egg pain, the second is in order to find out where the problem lies. Three is ...

jquery has an object ajaxseetings, Ajax request the most basic configuration is here, the structure is as follows

Ajaxsettings: {
        Url:location.href,
        Global:true,
        Type: "Get",
        ContentType: "Application/x-www-form-urlencoded",
        Processdata:true,
        Async:true,
        /*
        timeout:0,
        Data:null,
        Username:null,
        Password:null,
        Traditional:false,
        */
        Create the Request object; Microsoft failed to properly
        Implement the XMLHttpRequest in IE7 (can ' t request local files),
        So we use the ActiveXObject when it is available
        This function can is overriden by calling Jquery.ajaxsetup
        Xhr:window. XMLHttpRequest && (window.location.protocol!== "file:" | |! Window. ActiveXObject)?
            function () {
                Return to new window. XMLHttpRequest ();
            } :
            function () {
                try {
                    Return to new window. ActiveXObject ("Microsoft.XMLHTTP");
                catch (e) {}
            },
        Accepts: {
            XML: "Application/xml, Text/xml",
            HTML: "Text/html",
            Script: "Text/javascript, Application/javascript",
            JSON: "Application/json, Text/javascript",
            Text: "Text/plain",
            _default: "*/*"
        }
    }

Basically the name can represent its configuration items, ProcessData may be unfamiliar. We pass a Key/value object when we request a resource using get and other top-level functions. For example $.get ("xxxx", {name: ' PR ', password: ' PR '}, ...); If the process is set to True,{name: ' PR ', password: ' PR ' will be converted to name=pr&password=pr; so that in the back if the Ajax way for get will append the loaded string to the URL, If set to False, this conversion is not done, the default is true, and it is best not to change. It's worth looking at. Attribute XHR, this property is a function, of course, the function will eventually return the browser-compatible XMLHttpRequest object. The core operating object of Ajax is it, which eliminates the tangle of compatibility issues when we construct XMLHttpRequest objects ourselves.

Ajax:function (origsettings), Ajax accepts a configuration object, like the ajaxsettings structure above,

var s = Jquery.extend (true, {}, jquery.ajaxsettings, origsettings);
        
        var jsonp, status, data,
            Callbackcontext = origsettings && Origsettings.context | | S
            Type = S.type.touppercase ();
        Convert data if not already a string
        if (s.data && s.processdata && typeof s.data!== "string") {
            S.data = Jquery.param (S.data, s.traditional);
        }

The function first merges the default configuration with the incoming configuration, noting that there is a {} in the function so that the merge does not affect the original values of Ajaxsettings and originsettings. Callbackcontext is the implementation of Ajax callback functions is the context of the function. Not much else to say. Then decide whether to convert the data object to a Parameter form string according to Data,processdata and data as String. Jquery.param is a tool function that is used by traditional to determine whether a deep traversal is needed to generate a parameter string. See the jquery documentation for specific examples.

Handle JSONP Parameter Callbacks
        if (S.datatype = = "Jsonp") {
            if (type = = "Get") {
                if (!jsre.test (S.url)) {
                    S.url + = (rquery.test (s.url)? "&": "?" + (S.jsonp | | "Callback") + "=?";
                }
            else if (!s.data | |!jsre.test (s.data)) {
                S.data = (S.data s.data + "&": "") + (S.jsonp | |) Callback ") +" =? ";
            }
            S.datatype = "JSON";
        }
        Build temporary JSONP function
        if (S.datatype = = "JSON" && (s.data && jsre.test (s.data) | | jsre.test (S.URL))) {
            Jsonp = S.jsonpcallback | | ("Jsonp" + jsc++);
            Replace the =? Sequence both in the query string and the data
            if (s.data) {
                S.data = (S.data + ""). Replace (jsre, "=" + Jsonp + "$");
            }
            S.url = S.url.replace (jsre, "=" + Jsonp + "$");
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.