Ajax学习:
1,Ajax的概念
局部刷新技术,不是一门新技术,是一种前端的技术
2,Ajax的作用
实现在当前页面响应其他的请求,不改变地址栏地址
3,Ajax的使用流程
//声明Ajax引擎
//复写onreadystatechange方法
//判断Ajax的状态码
//判断响应状态码
//获取响应内容(响应内容的格式)
//字符串
//jone(重点)
//其实就是按照jone的格式进行字符串的拼接,然后用eval方法将这个字符串
//进行转换,最终变成对象
// eval("var u="+result);
jone格式
var 对象名={
属性名:属性值
属性名:属性值
.......
}
//XML
//处理响应内容(JS操作文档结构)
//发送请求
//get请求
//直接在url后面拼接用?隔开
ajax.open("get","AjaxServlet?"+date);
ajax.send(null);
alert("哈哈")
//post请求
//必须有请求实体
ajax.open("post", "AjaxServlet");
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
ajax.send("name=张三&pwd=123")
Ajax的状态码
ajax的状态码:0,1,2,3,4
4:代表响应内容被成功接收
响应状态码:
200:代码能正常响应
404:资源未找到
500:内部服务器出错
4,Ajax的同步和异步
ajax.open(method,url,async)
method:请求方式
url:请求的路径
async:代码同步还是异步(默认是异步)
ture:代表异步
false:代表同步
<!-- 声明js代码域 -->
<script type="text/javascript">
function getData(){
//创建ajax引擎对象
var ajax;
if(window.XMLHttpRequest){//火狐
ajax=new XMLHttpRequest();
}else if(window.ActiveXObject){//ie
ajax=new ActiveXObject("Msxml2.XMLHTTP");
}
//复写onreadystatechange函数
ajax.onreadystatechange=function(){
//设置ajax的状态码
if(ajax.readyState==4){
//判断响应状态码
if(ajax.status==200){
//获取响应内容
var result=ajax.responseText;
//获取元素对象
var showdiv=document.getElementById("showdiv");
showdiv.innerHTML=result;
}else if(ajax.status==404){
var showdiv=document.getElementById("showdiv");
showdiv.innerHTML="访问地址不存在";
}else if(ajax.status==500){
var showdiv=document.getElementById("showdiv");
showdiv.innerHTML="服务器繁忙";
}
}
}
//发送请求
ajax.open("get","AjaxServlet",true);
ajax.send(null);
alert("哈哈");
}
</script>
-->