AJAX简介

AJAX 全称为 Asynchronous JavasScript And XML，就是异步的 JS 和 XML；

通过 AJAX 可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据；AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式；

随着前端技术的演进和框架的普及，AJAX 应用的方式越来越多，逐渐变成一个很大的话题，本笔记也只记关键知识点，尽量略去废话；

参考笔记: ​​Javascript(笔记49) - AJAX - AJAX简介、工作流程、同步、异步​​

XML 简介

XML 可扩展标记语言，被设计用来传输和存储数据；XML和HTML类似都有标签，不同的是HTML中都是预定义的标签，而XML中没有预定义的标签，全都是自定义标签，用来表示一些数据；

比如，描述一个学生数据： 姓名：孙悟空；年龄：18岁；性别：男；

用XML表示：

<student>
    <name>孙悟空</name>
    <age>18</age>
    <gender>男</gender>
</student>

现在已经JSON取代了：

{"name":"孙悟空","age":18,"gender":"男"}


AJAX的特点

优点：

1）可以无需刷新页面而与服务器端进行通信；

2）允许你根据用户事件来更新部分页面内容（如：点击，表单等）；


缺点：

1）没有浏览历史，不能回退；

不像浏览页面时可以回退到前一个页面，但AJAX没法回退；

2）存在跨域问题（同源）；

a.com 向 b.com 发送请求，默认是不允许的；

3）SEO不友好；

AJAX请求的内容不会显示在“页面的源代码”中，爬虫爬不到。


无刷新与服务端通信的应用

1）百度搜索框

原生AJAX(笔记01) - AJAX简介、特点_AJAX

提示：搜索框内输入 关键字，弹窗中会出现跟关键字相关的搜索项，这就是典型的就用；

2）表单验证

原生AJAX(笔记01) - AJAX简介、特点_AJAX_02

提示：使用已有用户名，会提示邮箱地址被占用；

3）懒加载

有些页面是滚动到下面之后才会临时从服务器中获取数据显示等；

以上都是基于不刷新页面获取数据的实例，在应用中体验比刷新页面强；