AJAX_get请求和post请求实例代码

Posted 2020-10-01 张八百_php学习笔记

GET 请求：

<script>
    function getData(){
        //1.创建ajax对象
        var xhr = new XMLHttpRequest();
        //2、给ajax状态绑定状态改变的监听函数，在函数中判断状态等于4开始接受数据
        xhr.onreadystatechange=function(){
            if(xhr.readyState == 4){
                //根据返回的结果开始业务逻辑
            }
        }
        //3、.创建一个http请求，指定服务器的url地址
        xhr.open(‘get‘,"./response.php?name=fm",true); //第三个参数true是异步，false就是同步
        //4、.发送一个http请求
        xhr.send(null); //get 请求参数直接null ， post请求需要拼接请求的字符串如：name=aaa&age=24
    }
</script>

POST请求：

<script>
    function postData(){
        //1.创建ajax对象
        var xhr = new XMLHttpRequest();
        //2、给ajax的状态改变绑定一个监听函数，监听状态等于4，接受数据，进行业务逻辑处理
        xhr.onreadystatechange=function(){
            if(xhr.readyState == 4){
                    //根据返回的结果开始业务逻辑
            }
        }
        //3.建立一个http连接，这里的参数依旧要用get方式接收
        xhr.open(‘post‘,‘reponse.php?address=beijinglu‘,true);
        //4.设置post请求头，作用模拟form表单来提交数据
        xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        //5.发送ajax请求，这里的参数要通过post接收
        xhr.send("name=xiaoming&age=100");
    }
</script>