AJAX入门学习-1：理解ajax

Posted 2021-02-09

小生博客：http://xsboke.blog.51cto.com

如果有疑问,请点击此处,然后发表评论交流,作者会及时回复。

                        -------谢谢您的参考，如有疑问，欢迎交流

---

一. 什么是ajax

    ajax：asynchronous javascript and xml，异步javascript和xml，即使用javascript语言与服务器进行异步交互，传输的数据库为
    xml（当然，传输数据的不只是xml）

    ajax还有一个最大的特点就是，当服务器响应时，不用刷新整个浏览器页面，而是可以局部刷新，这一特点给用户的感受是在
    不知不觉中完成请求和响应过程

    - 与服务器异步交互
    - 浏览器页面局部刷新

二. 同步交互与异步交互

    - 同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求
    - 异步交互：客户端发出一个请求后，无等待服务器响应结束后，就可以发出第二个请求

三. 局部刷新

    比如百度的搜索框，输入一个字，百度会自动联想你想搜索的东西，这时候页面并没有刷新，这就是局部刷新
    比如，在某些网站注册用户时，会提示用户名被占用，这是因为当你输入完，焦点移出输入框时，就会从数据库验证用户是否存在

四. ajax的优缺点
4.1 优点

        - ajax使用javascript技术向服务器发送异步请求；
        - ajax无需刷新整个页面；
        - 因为服务器响应内容不再是整个页面，而是页面中的局部，所以ajax性能更高

4.2 缺点

        - ajax并不适合所有场景，很多时候还是要使用同步交互
        - ajax虽然提高了用户体验，但是无形中向服务器发送的请求次数增多，导致服务器压力增大
        - 因为ajax是在浏览器中使用javascript技术完成的，所以还需要处理浏览器兼容性问题

五. ajax使用流程
5.1 四步操作：

        - 创建核心对象
        - 使用核心对象打开与服务器的连接
        - 发送请求
        - 注册监听，监听服务器响应

5.2 xmlhttprequest

        - open(请求方式，URL，是否异步)
        - send(请求体)
        - onreadystatechange，指定监听函数，他会在xmlhttp对象的状态发生变化时被调用
        - readystate，当前xmlhttp对象的状态，其中4状态表示服务器响应结束
        - status，服务器响应的状态码，只有服务器响应结束时才会有，200表示响应成功
        - responseText，获取服务器的响应体