用JS写的一个Ajax库(实例代码)

前端之家收集整理的这篇文章主要介绍了用JS写的一个Ajax库(实例代码)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

myajax是一个用js编写的一个跨浏览器的ajax库,支持get,post,jsonp请求,精巧,简单。

一、发送GET请求:

data: {},//参数 url: "",//请求地址 //发生错误调用 error: function(data) { },//请求成功调用 success: function(data){ //eval(data); 将字符串转换成json } });

二、发送POST请求:

错误是调用 error: function(data) { },//请求成功调用 success: function(data){ //eval(data); 将字符串转换成json } });

三、发送JSONP请求:

调用 success: function(data) { },//发生错误调用 error: function() { } });

源码:

post: function(params){ var xmlhttp = this.createXMLHttpRequest(); if (xmlhttp != null) { var async = true; if (typeof params.async != "undefined") async = params.async; var data = null; if (typeof params.data != "undefined") data = params.data; var url = ""; if (typeof params.url != "undefined") url = params.url; if (url == null || url.length == 0) return; xmlhttp.open("POST",url,async); if (async){ xmlhttp.onreadystatechange = function(){ if (this.readyState==4){

if (this.status==200){

if (typeof params.success != "undefined") {
params.success(xmlhttp.responseText);
}
}
else {
if (typeof params.error != "undefined") {
params.error(xmlhttp.status + xmlhttp.statusText);
}
console.error(url + ": " + xmlhttp.status);
}
}
};
}

        xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        var param = "";
        for (var prop in data) {
            param += prop + "=" + data[prop] + "&";
        }
        param = param.substring(0,param.length - 1);
        xmlhttp.send(param);
        if (!async) {

            if (xmlhttp.readyState == 4 && xmlhttp.status == 200)

                if (typeof params.success != "undefined") {

params.success(xmlhttp.responseText);
}
else {
if (typeof params.error != "undefined") {
params.error(xmlhttp.status + xmlhttp.statusText);
}
console.error(url + ": " + xmlhttp.status);
}

        }
    }
},get: function(params){
    var xmlhttp = this.createXMLHttpRequest();
    if (xmlhttp != null)
    {
        var async = true;
        if (params.async != undefined)
            async = params.async;
        var url = "";
        if (params.url != undefined)
            url = params.url;
        if (url == null || url.length == 0)
            return;
        if (params.data != null) {
            var data = params.data;
            var paramPrefix = url.indexOf("?") == -1 ? "?" : "&";

            url = url + paramPrefix;
            for (var prop in data) {
                url += prop + "=" + data[prop] + "&";
            }
            url = url.substring(0,url.length - 1);
        }
        xmlhttp.open("GET",async);
        if (async){
            xmlhttp.onreadystatechange = function(){
                if (this.readyState==4){

if (this.status==200){
if (typeof params.success != "undefined") {
params.success(xmlhttp.responseText);
}
}
else {
if (typeof params.error != "undefined") {
params.error(xmlhttp.status + xmlhttp.statusText);
}
console.error(url + ": " + xmlhttp.status);
}
}
};
}

        xmlhttp.send(null);
        if (!async) {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                if (typeof params.success != "undefined") {

params.success(xmlhttp.responseText);
}
else {
if (typeof params.error != "undefined") {
params.error(xmlhttp.status + xmlhttp.statusText);
}
console.error(url + ": " + xmlhttp.status);
}

        }
    }
},createXMLHttpRequest: function(){
    if (window.XMLHttpRequest)
    {
        return new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
    //code for IE5 and IE6
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
    return null;
},getJSONP: function(params) {

    var url = null;
    if (typeof params.url != "undefined") {
        url = params.url;
    }
    if (url == null) {
        return;
    }

    var ff = "" + new Date().getTime() + (parseInt(Math.random() * 10000000000));
    eval("jsonpCallback_" + ff + "=" + function(data){

        if (typeof params.success != "undefined") {
            params.success(data);
        }
    });

    //根据url中是否出现过 "?" 来决定添加时间戳参数时使用 "?" 还是 "&" 
    var paramPrefix = url.indexOf("?") == -1 ? "?" : "&";

    url = url + paramPrefix + "jsonpCallback=" + "jsonpCallback_" + ff;
    var param = "";

    if (typeof params.data != "undefined" && params.data != null) {

        var data = params.data;
        for (var prop in data) {
            param += prop + "=" + data[prop] + "&";
        }
        param = param.substring(0,param.length - 1);
    }
    if (param.length > 0)
    url = url + "&" + param; 
    var script = document.createElement("script"); 
    document.body.appendChild(script); 
    script.src = url; 
    script.charset ="UTF-8";
    // for firefox,google etc.
    script.onerror = function() {
        if (typeof params.error != "undefined") {
            params.error();
        }

    }
    script.onload = function() {

    document.body.removeChild(script); 
    } 
    // for ie 
    script.onreadystatechange = function() { 
      if (this.readyState == "loaded" || this.readyState == "complete") { 
        document.body.removeChild(script);
      } 
    }
}

};

以上这篇用JS写的一个Ajax库(实例代码)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/ajax/46755.html

猜你在找的Ajax相关文章