原生的Ajax的实现

Posted 2020-09-23 彭蒙善

<script type="text/javascript">

    // Ajax固定的模版

    // 第一步：创建xhr对象，使用new关键字来调用内置的构造函数

    var xhr = new XMLHttpRequest();

    // 第二步：指定接收回来的内容。监听xhr

    // 对象的onreadystatechange事件，这个事件xhr对象的"就绪状态"改变的时候触发。我们只关心就绪状态为4的时候的事情；

    xhr.onreadystatechange = function(){

        if( xhr.readyState == 4 ){

            // 接收完文件要做的事情，让txt文本中的内容读取出来

            document.getElementById("info").innerhtml = xhr.responseText;

        }

    };

    // 第三步，创建哪一个请求，第一个参数请求是类型是get或post，第二个参数是请求的路径，第三个参数：是否是异步的机制；一定是true；

    xhr.open("get","test.txt",true);

    // 第四步：发送请求,圆括号内是请求的内容，get请求没有报文体写null；

    xhr.send(null);

</script>