11.30 AJAX
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了11.30 AJAX相关的知识,希望对你有一定的参考价值。
AJAX
Asynchronous javascript angXML
异步Javascript和XML
作用:在不刷新整页情况下更新页面数据
节省用户操作,减少数据请求
传输 获取数据
过程:
初始化-发送请求-服务器收到请求-服务器处理-返回结果
AJAX的方法
Open方法
open(method,url,async)
三个参数的含义:
1.提交方式
2.提交地址
3.异步(同步)
Send方法
发送数据请求
AJAN请求状态监控
onreadystatechange
readystate属性:请求状态
0(初始化)还没调用open()方法
1(载入)已调用send()方法,正在发送请求
2(载入完成)send()方法完成,再整发送请求
3(解析)正在解析响应内容
4(完成)响应内容解析完成,可以再客户端调用了
status属性:服务器(请求资源)的状态
AJAX返回数据的处理
返回的内容:
responseText:返回以文本形式存放的内容
responseXML:返回XML形式的内容
返回数据的处理
数据类型;XML、HEML、JSON
JSON.parse():字符串解析成对象
异常处理:
try{
//此处的可能产生列为的语句
}catch(e){
//此处是负责列外处理的语句
}finally{
//此处是出口语句 try/catch执行完成所执行
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>AJAX</title>
<script>
window.onload = function () {
function ajax(method,url,async,/*reqData,*/cb) {
var xmlHttp = null;
if(window.ActiveXObject){ //如果是IE
xmlHttp = new ActiveXObject(‘Microsoft.XMLHTTP‘)
}else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest(); // 实例化一个xmlHttp
}
//如果实例化成功,就调用open()方法,开始准备向服务器发送请求
if(xmlHttp != null){
xmlHttp.open(method,url,async);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
xmlHttp.send(null);
// xmlHttp.send(reqData);
xmlHttp.onreadystatechange = doReult //设置回调函数
}
//回调函数
//一旦readyState的值改变,将会调用这个函数,readyState=4表示完成响应
//设定函数doResult()
function doReult() {
if(xmlHttp.readyState == 4){
if(xmlHttp.status==200){
cb(xmlHttp.responseText)
}
}
}
}
ajax(‘post‘,‘http://192.168.1.182:3000/Handler/OfflineCourseHandler.ashx?action=indexshow ‘,true,function (resData) {
console.log(JSON.parse(resData))
});
// var reqData = ‘userName=xiaoxiong‘;
// ajax(‘post‘,‘http://192.168.1.182:3000/Handler/UserHandler.ashx?action=isLogin‘,true,reqData,function (resData) {
// console.log(JSON.parse(resData))
// });
}
</script>
</head>
<body>
</body>
</html>
以上是关于11.30 AJAX的主要内容,如果未能解决你的问题,请参考以下文章