AJAX请求的基本操作

AJAX请求的基本操作

1. ajax的基本使用
2. 怎么设置请求参数

ajax的基本使用(GET请求)

const xhr = new XMLHttpRequest();
     //2.初始化,设置请求方法和url
 xhr.open('GET','http://127.0.0.1:8000/server');
 //设置响应体数据的类型
 xhr.responseType = 'json';//返回回来的数据可以不做转换
 //3.发送请求
   xhr.send();
  	//4.事件绑定 处理服务端返回的结果
 	//on when 当...时候
    //readystate 是xhr对象属性，表示状态码,状态码有(0,1,2,3,4)
   /*
      0:表示初始化
      1：表示open方法已经调用完毕
      2：表示send方法已经调用完毕
      3: 表示服务返回部分结果
      4：表示服务端返回了所有结果
  */
     xhr.onreadystatechange = function () {
         if(xhr.readyState ===4){
              //判断（服务端返回了所有结果）
               if(xhr.status >= 200 && xhr.status < 300){
                //判断状态码 所有大于等于200小于300的成功
                  console.log(xhr.status);
                  console.log(xhr.statusText);
                  console.log(xhr.getAllResponseHeaders());
                  console.log(xhr.response);
                  div.innerText = xhr.response;
                    }else{
                        console.log('错误');
                    }

                }
            }

怎么设置请求参数

	//在xhr.open中进行拼接
	xhr.open('GET','http://127.0.0.1:8000/server?name=sky&age=18');

以下是截图:

如果是post请求也可以如下：

//3.发送请求
 xhr.send('name=sky&age=19');