AJAX 是什么？
AJAX 全称 Async JavaScript and XML，即“异步的 JavaScript 和 XML”。
背景
过去，浏览器向服务器发送请求，服务器会返回一整个HTML页面去替换老页面。而AJAX可以进行轻量级请求，通过 JS 修改局部页面。
如何实现
浏览器可以发请求，收响应，浏览器在window上加了一个XMLHttpRequest函数，用这个构造函数（类）可以构造出一个对象，JS通过它实现发请求，收响应。
//实现代码
const ajax = (method, url, data, success, fail) => {
var request = new XMLHttpRequest()
request.open(method, url)
request.onreadystatechange = function() => {
if(request.readyState === 4) {
if(request.status >=200 && request.status < 300 || request.status ===304) {
success(request)
} else {
fail(request)
}
}
}
request.send()
}
实战
实战1 加载CSS
过去方法：
<link rel=stylesheet href="1.css"/>
AJAX加载CSS：
1.创建HttpRequest对象(全称是XMLHttpRequest)
2.调用对象的open方法
3.监听对象的onload&onerror事件
4.调用对象的send方法（发送请求）
onreadystatechange
onerror并不能很好的兼容AJAX，改用 onreadystatechange事件，在事件处理函数里操作CSS文件内容。
readyState属性
实战2 加载JS
过去方法：
<script src="2.js"></script>
AJAX加载JS
1.创建HttpRequest对象(全称是XMLHttpRequest)
2.调用对象的open方法
3.监听对象的onreadystatechange事件
4.调用对象的send方法（发送请求）
实战3 加载HTML
过去还不会加载html
AJAX加载HTML
1.创建HttpRequest对象(全称是XMLHttpRequest)
2.调用对象的open方法
3.监听对象的onreadystatechange事件
4.调用对象的send方法（发送请求）
实战4 加载XML
过去不会加载xml
AJAX加载XML
1.创建HttpRequest对象(全称是XMLHttpRequest)
2.调用对象的open方法
3.监听对象的onreadystatechange事件，在事件处理函数里操作responseXML
4.调用对象的send方法（发送请求）
实战5 加载JSON
JSON
什么是JSON
JavaScript Object Notation，跟HTML、CSS、XML、JS一样，是一门独立的语言。JSON不是编程语言，是标记语言，跟HTML、XML、Markdown，用来展示数据。
支持的数据类型
string 只支持双引号，不支持单引号和无引号
number 支持科学计数法
bool true 和 false
null 没有undefined
object
array
JSON支持这六种，注意跟JS的数据类型区别开（array在JS数据类型中术语object类）
不支持函数，不支持变量（所以也不支持引用）
AJAX加载JSON
1.创建HttpRequest对象(全称是XMLHttpRequest)
2.调用对象的open方法
3.监听对象的onreadystatechange事件，在事件处理函数里使用JSON.parse
4.调用对象的send方法（发送请求）
window.JSON
JSON.parse
用来解析JSON字符串，构造由字符串描述的JavaScript值或对象。
将符合JSON语法的字符串换成JS对应类型的数据
JSON字符串 => JS数据
由于JSON只有六种类型，所以转成的数据也只有6种
如果不符合JSON语法，则直接抛出一个Error对象
一般用try catch捕获错误
-
例1
5.json中写入字符串如下
main.js命令打印出JSON字符串和JS数据
打印结果如下，JSON字符串转成JS对象
-
例2
5.json写入true（布尔）
main.js命令打印出JSON字符串和JS数据
打印结果如下，将JSON字符串解析为布尔值true
JSON.stringify
是JSON.parse的逆运算
JS数据 => JSON字符串
由于JS的数据类型比JSON多，所以不一定能成功
如果失败，就抛出一个Error对象
总结
HTTP是个筐，什么都能往里装
可以装HTML、CSS、JS、XML……
记得设置正确的Conetnt-Type
解析方法
得到CSS之后生成style标签
得到JS之后生成script标签
得到HTML之后使用innerHTML 和 DOM API
得到XML之后使用responseXML 和 DOM API
不同诗句类型有不同数据类型的解析办法
