Ajax使用原生js创建的步骤

创建步骤（使用原生js）

1，创建加载函数，获取页面中元素

2，给页面中元素添加事件

3，创建Ajax对象

var hxr1 = new XMLHttpRequest(); 新版本

var hxr2 = new ActiveXObject(“Microsoft.XMLHTTP”); 老版本

在创建对象时需要使用判断语句判断(window.XMLHTTPRequest)是新版本还是旧版本

4,准备发送

​ xhr1.open(请求类型(post或者get),文件在服务器上的位置,同步或者异步(false/true))

​ xhr1.send();

​ 使用get请求时用null,且需要将数据添加到open的地址中

​ 在使用post请求时需要在send前添加

​ xhr1.setRequestHeader(‘Content-Type’,‘application/x-www-from-urlencoded’);

​ 然后将参数写进send中

​ xhr1.send(参数);

5,回调函数

​ xhr1.onreadystatechange=function(){

​ if(xhr1.readystate==4 && xhr1.status ==200){

​ 需要执行的命令;

​ 接受数据

​ }

}

readystate的值

• 0: 请求未初始化
• 1: 服务器连接已建立
• 2: 请求已接收
• 3: 请求处理中
• 4: 请求已完成，且响应已就绪

具体代码如下

// 创建对象
var ajax = new XMLHttpRequest();

// 设置参数,参数一:请求方式(post/get);   参数二:url地址
ajax.open('get','url');
// 发送请求
ajax.send();
//添加http头，发送信息至服务器时内容编码类型
ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//注册事件 onreadystatechange
ajax.onreadystatechange=function() {
    if (ajax.status==200 && ajax.readyState==4) {//如果能够进到这个判断 说明数据回来了,并且请求的页面是存在的
      console.log('成功');  
    }
}

status的值

200: “OK”
404: 未找到页面

https://www.cnblogs.com/ertingbo/p/7049352.html (状态码查询)