AJAX5步法
1、创建异步对象XMLHttpRequest
2、设置回调函数
3、open()方法连接服务器
4.send()方法发送数据至服务器
5、回调函数中针对不同响应状态进行处理，局部更新界面
完整代码如下所示
接下来测试下get请求类型，将open连接服务器步骤里的请求类型设置为get，如下所示
利用HBuilder编辑器打开(启动时自带本地服务器)如下所示
接下来转换JSON数据为普通JS对象型，如下所示
AJAX封装
目前为止，已经实现基本功能，但AJAX的调用还十分麻烦，步骤比较繁琐，在日常开发一般会将其进行封装，所以接下来封装下AJAX功能相关步骤函数，以后使用直接调用即可，同时大大提高了开发效率。
为了使用方便，接下来封装AJAX的get和post
封装：基本模板与传参
此时调用模板时，如下所示
封装1：建立异步对象
封装2：判断请求类型
封装2：判断请求类型
get请求类型传值方式是将数据拼接到路由后进行传值，所以接下来需要判断是否传值(对比post请求)，回顾之前所讲
1、get请求类型传值方式是将数据拼接到路由后进行传值
2、post请求类型判断是否有传值，如果有则send发送至服务器，没有则不发
封装3：注册事件，针对不同状态进行响应，获取返回数据
开发中，也可以将响应，即注册事件步骤，直接移至第一步创建异步对象下，以便更好地监听到状态变化。
封装调用：
接下来外部传参调用下封装的AJAX函数
此时控制台测试，便可以输出打印JSON格式数据，所以如果想用JS进一步操作，需要进行反序列化解析即JSON.parse()，然后操作其对页面进行局部更新。
AJAX跨域
跨域简介：
AJAX跨域指的是JS在不同的域之间进行数据传输或通信。
跨域方案：
1、jsonp跨域(重点)----前端处理方法
2、cros跨域-----后台处理
常见跨域场景？
所谓的同源是指，域名、协议、端口均为相同。
http://www.nealyang.cn/index.html 调用 http://www.nealyang.cn/server.php 非跨域
http://www.nealyang.cn/index.html 调用 http://www.neal.cn/server.php 跨域,主域不同
http://abc.nealyang.cn/index.html 调用 http://abc.neal.cn/server.php 跨域,子域名不同
http://www.nealyang.cn:8080/index.html 调用 http://www.nealyang.cn/server.php 跨域,端口不同
https://www.nealyang.cn/index.html 调用 http://www.nealyang.cn/server.php 跨域,协议不同
localhost 调用 127.0.0.1 跨域
AJAX跨域-JSONP
JSONP跨域：
jsonp跨域原理：借助网页标签中src属性的跨域特性实现
src简介：src是source的缩写，资源的意思，在html中src表示资源地址，是js文件和图片文件的引入方式，经常引用外部资源，可以实现跨域访问，如下所示
接下来调用下百度搜索接口，如下所示
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/?wd=&cb=
解析：
wd为搜索关键词，百度搜索功能发送请求类型为get，因为所搜的关键词可以在url中可见。这里先不用回调
将之前代码做下调整，将url改为百度搜索接口，如下所示
注意：
因为是get方式，所以关键词传值需要拼接到url里，即通过data传参，且参数为想要的关键词，然后之前封装好的AJAX会将其进行封装，也就是说最后send对应的接口url为经过封装的AJAX函数拼接后的地址
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/?wd=海贼王
将之前代码做下调整，将url改为百度搜索接口，如下所示
接下来使用JSONP实现跨域，本质利用src属性的跨域请求资源特性，同理脚本标签也是通过src引入资源，所以可以进行封装处理，实现AJAX的跨域访问远程资源。
接下来做下测试，script标签引入接口文件，并在接口加入回调函数，然后在页面定义调用
测试结果如下
此时虽然有报错，但是已经没有报跨域错误，接下来将调用位置做下调整，先定义声明函数，然后再进行传值，如下所示
修改后测试结果如下
AJAX跨域-CROS
除了通过JSONP解决跨域外，常见的方法还包含CROS方法
【前言】
CROS需要在后台进行配置→允许所有域名访问
1、PHP后台仅仅需要添加一句代码即可 header(’ Access-Control-Allow-Origin : * '); 表示允许所有域名访问。
2、JAVA后台需要下载CROS包，然后进一步配置