什么是Ajax

异步的javascript和xml， AJAX 是一种用于创建快速动态网页的技术。
AJAX 就是浏览器提供的一套 API，可以通过 JavaScript 调用，从而实现通过代码控制请求与响应。实现通过 JavaScript 进行网络编程。
XML：最早在客户端与服务端之间传递数据时所采用的数据格式。
Ajax用来与后台交互A

Ajax的原理

引用一个例子，我们不妨先举个“领导想找小李汇报一下工作”例子，领导想找小李问点事，就委托秘书去叫小李，自己就接着做其他事情，直到秘书告诉他小李已经到了，最后小李跟领导汇报工作。Ajax请求数据流程与“领导想找小李汇报一下工作”类似。其中最核心的依赖是浏览器提供的XMLHttpRequest对象，它扮演的角色相当于秘书，使得浏览器可以发出HTTP请求与接收HTTP响应。浏览器接着做其他事情，等收到XHR返回来的数据再渲染页面。

Ajax的使用

1.创建Ajax对象

const xhr=new XMLHttpRequest();//同步

2.向服务器发送请求

xhr.open(method,url,async);//同步
xhr.send();//同步还是异步取决于async

method：请求的类型：GET或POST
url:文件在服务器上的地址
async: true(异步)或false(同步),可以不写，默认是true(异步)
注意post请求一定要设置请求头的格式内容

xhr.open("POST","./01-ajax.php",true);
//设置请求头
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send("name=leon&age=18");  //post请求参数放在send里面，即请求体

语法：xhr.setRequestHeader(header,value)

header: 一般设置"Content-Type",传输数据类型，即：服务器需要我们传送的数据类型。
value: 具体的数据类型，常用"application/x-www-form-urlencoded"和"application/json"。

3.服务器响应处理(注意区分同步和异步)

responseText 获得字符串形式的响应数据
responseXML 获得XML形式的响应数据

(1)同步处理

xhr.open("GET","info.txt",false);
xhr.send();
console.log(xhr.responseText);

(2)异步处理
- 在主流浏览器能使用这个在谷歌等主流浏览器才能用，这个事件只有当readyState发生改变时，才会触发的事件
```
xhr.onload=function(){
    console.log(xhr.responseText);
}
```
- 在所有浏览器里都能用

xhr.onreadystatechange=function(){
    if(xhr.readystate==4&&xhr.status==200){
        console.log(xhr.responseText);
    }
}

readyState readyState是XMLHttpRequest对象的一个属性，用来标识当前XMLHttpRequest对象处于什么状态，readyState总共有5个状态值，分别为0~4

0：未初始化--尚未调用.open()方法
1：启动--已经调用.open()方法，但未调用.send()方法；
2：发送--已经调用.send()方法，但尚未接收到响应；
3：接收--已经接收到部分响应数据；
4：完成--已经接收到全部响应数据，而且已经可以在客户端使用了。

status xhr.status状态码就是http状态码，取值200表示从客户端发来的请求在服务器端被正常处理了

其他要注意的地方

一、json

定义
json是一种轻量级的数据交换格式，采用完全独立于编程语言的文本格式来存储和表示数据。
json和js对象的关系

var obj = {a:"Hello" , b: "World"}; // 这是一个JS对象
var JSON1 = '{a:"Hello" , b: "World"}' // 这是一个非标准的JSON字符串 本质是一个字符串
var JSON2 = '{"a":"Hello" , "b": "World"}' // 这是一个标准的JSON字符串 本质是一个字符串

json和js对象的相互转换

json字符串转换为js对象，处理标准的JSON字符串使用JSON.parse();

var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}

处理非标准或标准JSON字符串方法，使用eval()方法

    var JSON1 = '{a:"Hello" , b: "World"}' // 这是一个非标准的JSON字符串 本质是一个字符串
    var JSON2 = '{"a":"Hello" , "b": "World"}' // 这是一个标准的JSON字符串 本质是一个字符串
    var obj1 = eval("(" + JSON1 + ")");
    var obj2 = eval("(" + JSON2 + ")");
    // 此方法也可用于标准JSON字符串
    console.log(obj1) //{a: 'Hello', b: 'World'}
    console.log(obj2)//{a: 'Hello', b: 'World'}

js对象转JSON字符串，使用JSON.string()方法:

var json = JSON.stringify({a: 'Hello', b: 'World'}); //结果是 '{"a": "Hello", "b": "World"}'

二、小技巧

1.截取字符串中除了最后一个字符

var strVal="name=leon&age=18&"
strVal=strVal.slice(0,-1);//slice 并不会修改原字符串，包前不包后，
//如果该参数为负数，则被看作是 strLength + endIndex，这里的 strLength 就是字符串的长度
console.log(strVal)//name=leon&age=18

2.php中的json_encode(); 成功则返回 JSON 编码的字符串或者在失败时返回 false ;
3.php中其中三种的输出方式
echo "hello"; //没有返回值，用于输出一个或多个字符串
print_r( $arr); //可以有返回值，可以打印复杂类型变量的值 var_dump($ arr); //会输出类型等，常用于测试
4.js中forEach();遍历数组

array.forEach((数组元素,索引,原数组)=>{})//参数1是至少在的，参数2和参数3是可选的

5.php中foreach()遍历数组

$arr=arr("name"=>"leon","age"=18);
foreach($arr as $value){
    print_r($arr1);echo '<br>';//原数组
    print_r($v); echo '<br>';//键值对中的键值，leon 18 code
}

6.php中拼接字符串用点语法 .