JavaScript写一个Ajax

最新推荐文章于 2025-09-15 09:12:42 发布

原创最新推荐文章于 2025-09-15 09:12:42 发布 · 650 阅读

0 ·

CC 4.0 BY-SA版权

本文为博主原创文章，转载请注明出处。

文章标签：

#javascript #ajax

前端专栏收录该内容

186 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现AJAX请求的方法。包括了创建请求对象、设置请求方式、发送请求及处理响应的过程。示例代码展示了如何进行GET和POST请求，并设置请求头。

js实现ajax

js实现ajax

var xmlHttpReq = null;
if(window.ActiveXObject) {
    xmlHttpReq = new ActiveXObject('Microsoft.XMLHTTP');
} else if(window.XMLHttpRequest) {
    xmlHttpReq = new XMLHttpRequest();
}
xmlHttpReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttpReq.open('GET','test.php',true);
xmlHttpReq.onreadystatechange = function(){
    if(xmlHttpReq.readyState === 4) {
        if(xmlHttpReq.status === 200) {
            alert(xmlHttpReq.responseText);
        }
    }
};
xmlHttpReq.send(null);

例子如下：

submit.onclick = function(){
    var xmlHttpReq = null;
    if(window.ActiveXObject) {
        xmlHttpReq = new ActiveXObject('Microsoft.XMLHTTP');
    } else if(window.XMLHttpRequest) {
        xmlHttpReq = new XMLHttpRequest();
    }
    xmlHttpReq.open('POST','http://10.2.229.82:8088/api/friend',true);
    xmlHttpReq.onreadystatechange = function(){
        if(xmlHttpReq.readyState === 4) {
            if(xmlHttpReq.status === 200) {
                alert(xmlHttpReq.responseText);
            }
        }
    };
    xmlHttpReq.send("a=1,b=2");
};

如果要设置请求头的话：

submit.onclick = function(){
    var xmlHttpReq = null;
    if(window.ActiveXObject) {
        xmlHttpReq = new ActiveXObject('Microsoft.XMLHTTP');
    } else if(window.XMLHttpRequest) {
        xmlHttpReq = new XMLHttpRequest();
    }

    xmlHttpReq.open('POST','http://10.2.229.82:8088/api/friend',true);
    xmlHttpReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
    xmlHttpReq.onreadystatechange = function(){
        if(xmlHttpReq.readyState === 4) {
            if(xmlHttpReq.status === 200) {
                alert(xmlHttpReq.responseText);
            }
        }
    };
    xmlHttpReq.send("a=1,b=2");
};