手写原生ajax

工程师峻成技术 2022年11月9日

0 收藏 592 点赞 3,272 浏览 1381 个字

　　　　关于手写原生ajax重要不重要，各位道友自己揣摩吧，本着学习才能进步，分享大家共同受益，自己也在自己博客里写一下

function createXMLHTTPRequest() {
                 //1.创建XMLHttpRequest对象
                 //这是XMLHttpReuquest对象无部使用中最复杂的一步
                 //需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同的代码
                 var xmlHttpRequest;
                 if (window.XMLHttpRequest) {
                     //针对FireFox，Mozillar，Opera，Safari，IE7，IE8
                    xmlHttpRequest = new XMLHttpRequest();
                     //针对某些特定版本的mozillar浏览器的BUG进行修正
                     if (xmlHttpRequest.overrideMimeType) {
                         xmlHttpRequest.overrideMimeType("text/xml");
                     }
                 } else if (window.ActiveXObject) {
                     //针对IE6，IE5.5，IE5
                     //两个可以用于创建XMLHTTPRequest对象的控件名称，保存在一个js的数组中
                     //排在前面的版本较新
                     var activexName = [ "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
                     for ( var i = 0; i < activexName.length; i++) {
                         try {
                             //取出一个控件名进行创建，如果创建成功就终止循环
                             //如果创建失败，回抛出异常，然后可以继续循环，继续尝试创建
                            xmlHttpRequest = new ActiveXObject(activexName[i]);
                            if(xmlHttpRequest){
                                break;
                            }
                         } catch (e) {
                         }
                     }
                 }
                 return xmlHttpRequest;
             }

然后就是常见的GET 和POST请求

Get请求代码

function get(){
    var req = createXMLHTTPRequest();
    if(req){
        req.open("GET", "http://test.com/?keywords=手机", true);
        req.onreadystatechange = function(){
            if(req.readyState == 4){
                if(req.status == 200){
                    alert("success");
                }else{
                    alert("error");
                }
            }
        }
        req.send(null);
    }
}

POST代码

   function post(){
    var req = createXMLHTTPRequest();
    if(req){
        req.open("POST", "http://test.com/", true);
        req.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=gbk;");
        req.send("keywords=手机");
        req.onreadystatechange = function(){
            if(req.readyState == 4){
                if(req.status == 200){
                    alert("success");
                }else{
                    alert("error");
                }
            }
        }
    }
}

希望能帮到各位，祝大家都能顺利。