Ajax使用
原生Ajax：
1、ajax：异步的javascript和XML，能够向服务器请求额外的数据而无需卸载页面，会带来更好的用户体验，包含XML但与ajax通信与数据格式无关
2、ajax核心：XMLHttpRequert对象（简称XHR）；request（请求）
3、使用XHR时要调用open(a1,a2,a3);方法a1:请求类型,a2:请求的url,a3:是否发送异步请求(ture/false)
4、send();请求在主体发送的数据
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ajax</title>
</head>
<body>
<!-- ajax：异步的javascript和XML，能够向服务器请求额外的数据而无需卸载页面，会带来更好的用户体验，包含XML但与ajax通信与数据格式无关 -->
<!-- ajax核心：XMLHttpRequert对象（简称XHR）；request（请求） -->
<script type="text/javascript">
// 1、定义一个xhr变量存放ajax对象
var xhr;
// 2、当window对象里面存在XMLHttpRequest时
if (window.XMLHttpRequest) {
// 实例化一个XMLHttpRequest()构造函数
xhr = new XMLHttpRequest();
} else {
// 为防止一些浏览器中没有XMLHttpRequest
// 当window对象里面没有XMLHttpRequest时就实例化一个ActiveXObject()构造函数
xhr = new ActiveXObject("Microsoft.XMLHTTP")
}
// 3、使用XHR时要调用open(a1,a2,a3);方法a1:请求类型,a2:请求的url,a3:是否发送异步请求(ture/false)
xhr.open("POST", "http://192.168.95.237:81/ajaxapi/public/index.php/api/api/selectuserid",true);
// 4、send();请求在主体发送的数据
// 发送请求如果需要发送到服务器的端的数据,那么send(data) ,data:数据 需转换为字符串类型的
xhr.send(JSON.stringify({"stuid":"1207"}));
//当readyState值每发生一次变化就调用一次onreadystatechange方法
xhr.onreadystatechange = function() {
// readystate为4代表已经接收全部响应数据,并且已经可以在客户端使用
if (xhr.readyState == 4) {
// readystate:状态为200时表示请求已经完全成功
if (status == 200) {
// responseText:作为响应主体被返回的文本
// JSON.parse():将字符串json转换为数组类型的json
// 把返回的数据responseText从string转换为JSON数据格式并打印出来
console.log(JSON.parse(xhr.responseText));
}
}
}
</script>
</body>
</html>
