AJAX数据交互之get与post

服务器

提供某种服务的机器(计算机)

qq音乐:音频服务器;腾讯视频:视频服务器等

什么是ajax

ajax技术 : 在网页不跳转的情况下 向服务器请求数据

ajax应用场景： 局部刷新

前后端交互的三个流程

请求(前端) ---> 处理(后端) ---> 响应(后端)

ajax工作原理(get)

         //(1).实例化ajax对象
        let xhr = new XMLHttpRequest()
        //(2).设置请求方法和地址
        //get请求的数据直接添加在url的后面 格式是 url?key=value
        xhr.open('get', '接口url')
        //(3).发送请求
        xhr.send()
        //(4).注册回调函数
        xhr.onload = function() {
            console.log(xhr.responseText)
        }

ajax工作原理(post)

        //(1).实例化ajax对象
        let xhr = new XMLHttpRequest()
        //(2).设置请求方法和地址
        xhr.open('post', '')
        //(3).设置请求头（post请求才需要设置）
        xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
        //(4).发送请求 ： 参数格式  'key=value' 
        xhr.send('key=value')
        //(5).注册回调函数
        xhr.onload = function () {
            console.log(xhr.responseText)
        }