ajax笔记

学习视频：bilibili动力节点Ajax学习视频

一、全局刷新和局部刷新

全局刷新：整个浏览器被新的数据覆盖。在网络中传输大量的数据。浏览器需要加载，渲染页面。
局部刷新：在整个浏览器的内部，发起请求，获取数据，改变页面中的部分内容。
  其余的页面无需加载和渲染，网络中数据传输量少，给用户的感受好。

ajax是用来做局部刷新的，局部刷新使用的核心对象是：异步对象（XMLHttpRequest）
这个异步对象是存在浏览器内存中的，使用JavaScript语法穿件和使用该对象。

二、ajax

1、什么是ajax
	全称：Asynchronous JavaScript and XML（异步的JavaScript和XML）。
	Asynchronous ：异步
	XML：一种数据格式

ajax是一种做局部刷新的新方法，不是一种语言，ajax包含的技术主要有JavaScript，dom，css，xml等等。
核心是JavaScript和xml。
JavaScript：负责创建异步对象，发送请求，更新页面的dom对象。
xml：网络中传输的数据格式

三、ajax中使用XMLHttpRequest对象

1、创建异步对象 var xmlHttp = new XMLHttpRequest();
2、给异步对象绑定事件。
	btn.onclick = fun11()
	function fun1(){
		alert("按钮单击");
	}
	
	onreadystatechange事件：当异步对象发起请求，获取了数据都会触发这个事件， 	
	这个事件需要指定一个函数，在函数中处理状态的变化。

	异步对象的属性 readyState 表示异步对象请求的状态变化
		0：创建异步对象时，new XMLHTTPRequest();
		1：初始异步请求对象，xmlHttp.open()
		2：发送请求，xmlHttp.send();
		3：从服务器端获取了数据，此时3，注意3是异步对象内部使用，获取了原始的数据，
		4：异步对象把接收的数据处理完成后，此时开发人员在4的时候。
			在4的时候，开发人员做什么？更新当前页面

	异步对象的status属性，表示网络请求的状况的，200,404，500，需要是当status=200时，表示网络请求成功

	例如：xmlHttp.onreadystatechange = function() {
		处理请求的状态变化
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
			//可以处理服务器端的数据，更新当前页面
		}
	}

3、初始异步请求对象
	异步的方法open().
	xmlHttp.open(请求方式get / post, “服务器端的访问地址”，同步 / 异步请求（默认true，异步请求）)
	true：异步处理请求。使用异步对象发起请求后，不用等待数据处理完毕，就可以执行其他的操作。
	false：同步，异步对象必须处理完请求，从服务器端获取数据后，才能执行其他代码。（任意时刻只能执行一个异步请求）
	例如：xmlHttp.open("get", "loginServlet?name=zs&password=123", true);
4、使用异步对象发送请求
	xmlHttp.send()

获取服务器端返回的数据，使用异步对象的属性 reponseText
使用例子：xmlHttp.reponseText	

回调：当请求的状态变化时，异步对象会自动调用onreadystatechange事件对应的函数

四、ajax与json

ajax发送请求----servlet（返回一个json格式的字符串{name:"河南",jiancheng:"豫",chengshi:"郑州"}）

json分类：
	1、json对象，JSONObject，这种对象的格式为：（名称：值，也可看做key：value格式）
	2、json数组，JSONArray，格式[{name:"河南",jiancheng:"豫",chengshi:"郑州"},{name:"河南",jiancheng:"豫",chengshi:"郑州"},{name:"河南",jiancheng:"豫",chengshi:"郑州"}]

为什么要使用json：
	1、json格式好理解
	2、json格式数据在多种语言中，比较容易处理，使用java，JavaScript读写json格式的数据比较容易
	3、json格式数据它占用的空间小，网络中传输快，用户体验好

处理json的工具库：
	gson（Google）
	fastjson（阿里）：速度快，不是最符合json处理规范的
	jackson：性能好，规范好
	json-lib：性能差，依赖多

在JavaScript中可以吧json格式的字符串，转为json对象，json中的key就是json对象的属性名