Ajax

最新推荐文章于 2022-06-19 13:50:53 发布

～萧

最新推荐文章于 2022-06-19 13:50:53 发布

阅读量92

点赞数

本文链接：https://blog.csdn.net/weixin_43096582/article/details/105864325

版权

Ajax

标准请求响应时浏览器的动作(同步操作)
1.1 浏览器请求什么资源,跟随显示什么资源
ajax:异步请求.
2.1 局部刷新,通过异步请求,请求到服务器资源数据后,通过脚本修改页面中部分内容.
ajax 由 javascript 推出的.
3.1 由 jquery 对 js 中 ajax 代码进行的封装,达到使用方便的效果.
jquery 中 ajax 分类
4.1 第一层 $.ajax({ 属性名:值,属性名:值})
4.1.1 是 jquery 中功能最全的.代码写起来相对最麻烦的.
4.1.2 示例代码

/*
	url: 请求服务器地址
	data:请求参数
	dataType:服务器返回数据类型
	error请求出错执行的功能
	success请求成功执行的功能,function(data) data服务器返回的数据.
	type:请求方式
	*/
	$.ajax({
			url:'demo',
			data:{"name":"张三"},
			dataType:'html',
			error:function(){
				alert("请求出错.")
			},
			success:function(data){
				alert("请求成功"+data)
			},
			type:'POST'
		});

4.2 第二层(简化 $. a j a x) 4.2.1$ .get(url,data,success,dataType))
4.2.2 $. p o s t (u r l, d a t a, s u c c e s s, d a t a T y p e) 4.3 第三层 (简化$ .get())
4.3.1 $.getJSON(url,data,success). 相当于设置 $.get 中dataType=”json”
4.3.2 $.getScript(url,data,success) 相当于设置 $.get 中dataType=”script”
5. 如果服务器返回数据是从表中取出.为了方便客户端操作返回的数据,服务器端返回的数据设置成 json
5.1 客户端把 json 当作对象或数组操作.
6. json:数据格式.
6.1JsonObject:json 对象,理解成 java 中对象
6.1.1{“key”:value,”key”:value}
6.2JsonArray:json 数组
6.2.1[{“key”:value,”key”:value},{}]

		List<Users> list = new ArrayList<Users>();
		list.add(users1);
		list.add(users);
		
		ObjectMapper mapper = new ObjectMapper();
		String result = mapper.writeValueAsString(list);

$("a").click(function(){
		$.post("demo",{"name":"张三"},function(data){
			var result="";
			for(var i =0 ;i<data.length;i++){
				result+="<tr>";
				result+="<td>"+data[i].id+"</td>"
				result+="<td>"+data[i].username+"</td>"
				result+="<td>"+data[i].password+"</td>"
				result+="</tr>";
			}
			//相当innerHTML先清空后添加
			$("#mytbody").html(result);
		})
		return false;
	})
});
</script>
</head>
<body>
<a href="demo">跳转</a>
<table border="1">
	<tr>
		<td>编号</td>
		<td>姓名</td>
		<td>密码</td>
	</tr>
	<tbody id="mytbody"></tbody>
</table>