ajax初识

Ajax学习:

1.ajax的概念
局部刷新计算,不是一门新技术,是多种技术的组合,是浏览器端的技术

2.ajax的作用
实现在当前结果页中显示其他请求的响应内容

3.ajax的使用

ajax的基本流程

//1. function getData() {
    		//创建ajax引擎对象
    		var ajax;
    		if (window.XMLHttpRequest) {
    			ajax = new XMLHttpRequest();
    		} else if (window.ActiveXObject) {
    			ajax = new ActiveXobject("Msxml2.XMLHTTP");
    		}

//	2. 复写onreadstatement函数 			
		 ajax.onreadystatechange = function() {
			//判断响应码
			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 = "服务器繁忙";
				}
			}else{
				var showdiv = document.getElementById("showdiv");
				//修改元素内容
				showdiv.innerHTML = "<img src=>";//动态图
			}
		}

//获取响应内容(响应内容的格式)
1.普通字符串:responseText
2.json串 responseText 其实就是将数据按照json的格式拼接好的字符串,方便使用eval方法将接收的字符串直接转换为js的对象 json格式:
var 对象名={
属性名:属性值
属性名:属性值
}
3.XML数据:responseXML,返回document对象 通过document对象将数据从xml中获取出来 //处理响应内容(js操作文档结构) //发送请求
get请求: get的请求实体拼接在URL后面,?隔开,键值对
post请求:有单独的请求实体

POST请求

ajax.open("post","CGB-ajax-0");
		ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		ajax.send("name=张三&pwd=123") 		

GET请求

ajax.open("get", "CGB-ajax-0");
		ajax.send(null);

ajax的状态码

readyState: 0,1,2,3,4

4:表示响应内容被成功接收

响应状态码:
status:
200:表示一切OK
404:资源未找到
500:内部服务器错误

ajax的异步和同步

ajax.open(method,URL,async)
async:设置同步代码执行还是异步代码执行
true代表异步,默认是异步
false代表同步