GET请求
index
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function() {
//1.获取a节点并对其添加onclick响应函数
document.getElementsByTagName("a")[0].onclick = function() {
//3.创建一个XMLHttpRequest对象
var request = new XMLHttpRequest();
//4.准备发送请求的数据：url
var url = this.href + "?time=" + new Date();//不同的时间戳，来达到禁用缓存的目的
var method = "GET";
//5.调用XMLHttpRequest 对象的open方法
request.open(method, url);
//6.调用XMLHttpRequest 对象的send方法
request.send(null);
//7.为XMLHttpRequest 对象添加onreadystatechange 响应函数
request.onreadystatechange = function() {
//alert(request.readyState);
//8.判断响应是否完成：XMLHttpRequest 对象的readyState 属性值为4的时候
if (request.readyState == 4) {
//9.在判断响应是否可用：XMLHttpRequest 对象status 属性值为200
if (request.status == 200 || request.status == 304) {
//10.打印响应结果： responseText
alert(request.responseText);
}
}
}
//2.取消 a节点的默认行为
return false;
}
}
</script>
</head>
<body>
<a href="helloAjax.txt">HelloAjax</a>
</body>
</html>
post请求
index2
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function() {
//1.获取a节点并对其添加onclick响应函数
document.getElementsByTagName("a")[0].onclick = function() {
//3.创建一个XMLHttpRequest对象
var request = new XMLHttpRequest();
//4.准备发送请求的数据：url
var url = this.href + "?time=" + new Date();//不同的时间戳，来达到禁用缓存的目的
var method = "POST";
//5.调用XMLHttpRequest 对象的open方法
request.open(method, url);
request.setRequestHeader("ContentType",
"application/x-www-form-urlencode");//符合的编码格式
//6.调用XMLHttpRequest 对象的send方法
request.send("name = 'colin'");
//7.为XMLHttpRequest 对象添加onreadystatechange 响应函数
request.onreadystatechange = function() {
//alert(request.readyState);
//8.判断响应是否完成：XMLHttpRequest 对象的readyState 属性值为4的时候
if (request.readyState == 4) {
//9.在判断响应是否可用：XMLHttpRequest 对象status 属性值为200
if (request.status == 200 || request.status == 304) {
//10.打印响应结果： responseText
alert(request.responseText);
}
}
}
//2.取消 a节点的默认行为
return false;
}
}
</script>
</head>
<body>
<a href="helloAjax.txt">HelloAjax</a>
</body>
</html>
数据格式JSON
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/*
数据放在一对大括号里 ，是键值对的集合，用冒号赋值
多个键值对使用逗号分隔，值本身还可以是json对象，也可以是方法(存储函数)
对象描述中的数据可以是字符串，数字或者布尔值。
*/
var jsonObject = {
"name" : "hemiao",
"age" : 22,
"address" : {
"city" : "Anhui",
"school" : "anshida"
},
"teaching" : function() {
alert("java+ssm ...");
}
};
// alert(jsonObject.name);
// alert(jsonObject.address.city)
// jsonObject.teaching()
var jsonStr = "{'name':'文静'}";
// 把一个字符串转为json对象
// alert(jsonStr.name);
// 使用eval()方法, 可以把一个字符串转为本地的js代码来执行
var testStr = "alert('hello eval')";
eval(testStr);
//把json字符串转为JSON对象
var json = eval("(" + jsonStr + ")");//需要加括号才可以的
alert(json.name)
</script>
</head>
<body>
</body>
</html>