1、全局刷新和局部刷新：
1）全局刷新：整个浏览器被新的数据覆盖，在网络中传输大量的数据（浏览器需要加载，渲染页面）。
2）局部刷新：在浏览器的内部，发起请求，获取数据，改变页面中的部分内容，其余的页面无需加载和渲染（网络中数据传输量少， 给用户的感受好）。
ajax 是用来做局部刷新的，局部刷新使用的核心对象是【异步对象（XMLHttpRequest）】，这个异步对象存在浏览器内存中 ，使用 javascript 语法创建和使用。
2、Asynchronous JavaScript and XML：
ajax —> Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）:
- xml 是网络中的一种传输的数据格式（json 替换了 xml）
1）ajax 是一种做局部刷新的新方法，不是一种语言，ajax包含的技术主要有 javascript ,dom , css , xml 等等（核心是 javascript 和 xml）。
2）javascript 负责创建异步对象， 发送请求， 更新页面的 dom 对象，ajax 请求需要服务器端的数据。
3、ajax 中使用 XMLHttpRequest 对象（四步）：
1）创建异步对象（第一步）：
var xmlHttp = new XMLHttpRequest();
2）给异步对象绑定事件（第二步）：
xmlHttp.onreadystatechange //当异步对象发起请求，获取了数据都会触发这个事件,这个事件需要指定一个函数,在函数中处理状态的变化
如何获取服务器端返回的数据？
- 使用异步对象的属性 responseText // xmlHttp . responseText
当请求的状态变化时，异步对象会自动调用 onreadystatechange 事件对应的函数（回调：当请求的状态变化时，异步对象会自动调用 onreadystatechange 事件对应的函数）
栗子：
xmlHttp.onreadystatechange= function(){
//处理请求的状态变化
if(xmlHttp.readyState == 4 && xmlHttp.status== 200 ){
//可以处理服务器端的数据，更新当前页面
var data = xmlHttp.responseText;
document.getElementById("name").value= data;
}
}
readyState（异步对象的属性） — 异步对象请求的状态变化：
- 0：创建异步对象时 //new XMLHttpRequest ( ) ;
- 1：初始异步请求对象 //xmlHttp.open ( ) ;
- 2：发送请求 //xmlHttp.send ( ) ;
- 3：从服务器端获取了数据，注意3是异步对象内部使用， 获取了原始的数据
- 4：异步对象把接收的数据处理完成后，此时开发人员在4的时候处理数据（更新当前页面）
异步对象的 status 属性，表示网络请求的状况（200， 404， 500），当 status == 200 时，表示网络请求成功。
3）初始异步请求对象（第三步）：
异步的方法：
-
open ( ) .xmlHttp . open ( get / post , “服务器端的访问地址” , true / false ) // true 为异步请求，false 为同步请求 ，默认为 true
-
异步请求特点：
1)某一个时刻，浏览器可以委托多个异步请求对象发送请求，无需等待请求处理完成；
2)浏览器委托异步请求对象工作期间，浏览器处于活跃状态。可以继续向下执行其他命令；
3) 当响应就绪后再对响应结果进行处理 。
- 同步请求特点：
1)某一个时刻，浏览器只能委托一个异步请求对象发送请求，必须等待请求处理完成；
2)浏览器委托异步请求对象工作期间，浏览器处于等待状态。不能执行其他命令；
3)不推荐使用。
栗子：
xmlHttp.open("get", "loginServlet?name=zs&pwd=123",true);
4）使用异步对象发送请求（第四步）：
xmlHttp.send();
4、json使用：
ajax（发起请求）—> servlet —> 返回一个 json 格式的字符串（可以将 json 对象格式看作成一个 “key:value”格式） // { name:”河北”, jiancheng:”冀”,”shenghui”:”石家庄”}
json分类：
- json对象 ，JSONObject
- json数组， JSONArray // [ { name:”河北”, jiancheng:”冀”,”shenghui”:”石家庄”} , { name:”山西”, jiancheng:”晋”,”shenghui”:”太原” } ]
为什么要使用 json？
- json 格式好理解
- json 格式数据在多种语言中，比较容易处理。 使用 java， javascript 读写 json 格式的数据比较容易
- json 格式数据它占用的空间小，在网络中传输快， 用户的体验好
处理 json 的工具库： gson（google）； fastjson（阿里），jackson， json-lib
- 在 js 中，可以把 json 格式的字符串，转为 json 对象， json 中的 key，就是 json 对象的属性名。
Original: https://www.cnblogs.com/Burning-youth/p/16047320.html
Author: 猿头猿脑的王狗蛋
Title: 【JavaWeb-Ajax】笔记汇总 — 全局刷新和局部刷新；ajax 中使用 XMLHttpRequest 对象（四步）；json 的使用
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/586418/
转载文章受原作者版权保护。转载请注明原作者出处！