首页 > 代码库 > Javascript学习------ajax

Javascript学习------ajax

原生js 封装ajax-纯粹网上直接照搬,没看懂希望下次回头看时能明白一点:

<!DOCTYPE html><html><body>    <script type="text/javascript">        // 使用原生js 封装ajax        // 兼容xhr对象        var $ = {            createXHR: function () {                if (typeof XMLHttpRequest != "undefined") { // 非IE6浏览器                    return new XMLHttpRequest();                } else if (typeof ActiveXObject != "undefined") {// IE6浏览器                    var version = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0","MSXML2.XMLHttp",];                    for (var i = 0; i < version.length; i++) {                        try {                            return new ActiveXObject(version[i]);                        } catch (e) {                        }                    }                } else {                    throw new Error("您的系统或浏览器不支持XHR对象!");                }            },            params: function (data) {                var arr = [];                for (var i in data) {                    arr.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));                }                return arr.join("&");            },            ajax: function (obj) {                var xhr = this.createXHR();                obj.url = obj.url + "?rand=" + Math.random(); // 清除缓存                obj.data = this.params(obj.data);      // 转义字符串                if (obj.method === "get") {      // 判断使用的是否是get方式发送                    obj.url += obj.url.indexOf("?") == "-1" ? "?" + obj.data : "&" + obj.data;                }                // 异步                if (obj.async === true) {                    // 异步的时候需要触发onreadystatechange事件                    xhr.onreadystatechange = function () {                        // 执行完成                        if (xhr.readyState == 4) {                            callBack();                        }                    }                }                xhr.open(obj.method, obj.url, obj.async);  // false是同步 true是异步 // "demo.php?rand="+Math.random()+"&name=ga&ga",                if (obj.method === "post") {                    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");                    xhr.send(obj.data);                } else {                    xhr.send(null);                }                // xhr.abort(); // 取消异步请求                // 同步                if (obj.async === false) {                    callBack();                }                // 返回数据                function callBack() {                    // 判断是否返回正确                    if (xhr.status == 200) {                        obj.success(xhr.responseText);                    } else {                        obj.Error("获取数据失败,错误代号为:" + xhr.status + "错误信息为:" + xhr.statusText);                    }                }            }        }        var html = document.getElementsByTagName("html")[0];        html.onclick = function () {            $.ajax({                "method": "post",                "async": false,                "url": "Main/settext",                "data": {                    "name": "gaga",                    "age": 10000000,                    "num": "12346&598"                },                "success": function (data) {                    alert(data);                },                "Error": function (text) {                    alert(text);                },                "async": false            });        }    </script></body></html>

 

Javascript学习------ajax