ajax的原理

其原理: 通过XmlHttpRquest对象来向服务器发送异步请求的,从而从服务器中获得数据后,然后用js来操作DOM来更新页面
简单来说: 用于后台与服务器交互数据,这就能实现可以在不重新加载整个网页的情况下,对网页的部分进行更新
ajax的核心: 就是js对象 XmlHttpRequest
特点: 异步加载, 局部更新
ajax给我们带来的好处: 1.页面无刷新, 在页面与服务器通信时,提高用户的体验
注意: 凡是涉及到ajax的访问, 不能使用文件协议(已文件的方式访问)

   //1.创建XmlHttpRequest对象---> 用于与服务器交换数据的 ---> 相当与创建http请求的一个对象
    var xhr = new XMLHttpRequest();
    //2.规定请求的类型(get , post),url地址,以及是否异步处理请求(布尔值),默认异步true
    // open()-->相当与服务器建一个特定端口的链接
    xhr.open('get','./test.txt');
    //3.将请求发送到服务器,开始请求  send()
    xhr.send();
    //4.等待响应,---> 因为不知道服务器什么时候才能返回我们需要的响应,要采用事件的机制去触发
    xhr.onreadystatechange = function () {
        // console.log(1111);
        //这个不是在响应时触发,在状态改变时触发
        console.log(this.readyState);//2,3,4
        //当响应已经就绪,则可以获取响应后的数据
        if (this.readyState == 4){
            console.log(this.responseText);//获取响应的文本
            document.getElementsByTagName("body")[0].innerHTML=this.responseText;
        }
    }