Ajax必知必会

1.Ajax

Asynchronous JavaScript and XML（异步的 JavaScript 和 XML），是与服务器交换数据，更新部分网页的技术，不加载整个页面

2.DOM模型

Document Object Model

查找Html元素：

var e1 = document.getElementById();//通过ID
var e2 = document.getElementByTagName();//通过标签名
var e3 = document.getElementsByClassName();//通过类名

改变Html的值

e1.innerHTML=新的 HTML	//改变html内容
e2.attribute=新属性值		//改变hrml属性

绑定事件

<script>
document.getElementById("myBtn").onclick=function(){displayDate()};
</script>

3.Ajax请求

两种请求方式的区别：

序号	对比	get	post
1	请求的数据是否暴露	请求数据附加在URL之后，以?分割URL和传输数据，多个参数用&连接	不会
2	传输数据的大小	有URL的长度和数据大小限制	无，请求数据放在HTTP请求包的包体中

回调函数：服务器相应完请求后，浏览器根据传输回的数据进行的操作的函数；

Ajax的jquery实现

//	格式1：ajax请求获得JSON数据，$.getJSON(url,data,function(data){});
// url:目标地址，不可省略
$.getJSON("/user/insert.do",
       user:user,
       function(data){
 //前端处理代码
});

//	格式2：ajax通过get请求获得的数据，$.get(url,data,function(data){},datatype);
// url:目标地址，不可省略
$.get("/user/insert.do",
       user:user,
       function(data){
 //前端处理代码
},"JSON");

//	格式3：ajax通过post请求获得的数据，$.post(url,data,function(data){},datatype);
// url:目标地址，不可省略
$.get("/user/insert.do",
       user:user,
       function(data){
 //前端处理代码
},"JSON");

4.JSON

(JavaScript Object Notation) ：一种数据交换格式

json创建和调用

//创建格式{"key1":value1,"key2":value2,..."keyn":valueN,}
var jsons={
	"key1":"username",//字符串类型
	"key2":1000,//number类型
	"key3":{		//json类型
		"key3_1":"userPhone",
		"key3_2":"number"
	}
	"key4":[{"key4_1_1":"abc","key4_1_2":456},{"key4_2_1":"abc","key4_2_2":456}]//json数组

}

//调用格式：变量名.属性
jsons.key1;
jsons.key3.key3_1;
json.key4[0].key4_1_1;

Json和Java实体类的转换

在线转换工具

工具类jar包