AJAX是什么?

AJAX 是Asynchronous JavaScript and XML(异步的JavaScript和XML),在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术

优点:在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术

缺点:不需要任何插件,但是需要用户允许JavaScript脚本在浏览器上执行

 

AJAX怎么使用

AJAX的使用必须依赖XMLHttpRequest对象

主流浏览器(IE7以上,Firefox,Chrome,Opera,....)都支持XMLHttpRequest,可以在直接通过new XMLHttpRequest直接获取;

IE5和IE6不支持XMLHttpRequest对象,需要通过ActiveXObject()方法获取;

下面是XMLHttpRequest的两种不同创建方式

function createXHR() 
		{	
			
			if(window.XMLHttpRequest)//判断浏览器是否XMLHttpRequest对象
				return XHR = new XMLHttpRequest();
			else
				return XHR = new ActiveXObject();	
				
		}

在XMLHttpRequest对象(我定义的变量名为XHR)创建完成之后,调用此对象的open方法,open方法有五个参数,分别是String method,String URL,async,username,password

method :指定HTTP方法,如“GET”,“POST”

URL:指定目标的相对或绝对路径

async:是否异步,默认为true;(AJAX中的第一个A就是在这里体现,你要是设置为false就很尴尬了)

username:验证用户名;(一般用不到)

password:验证用户密码;(用不到+1)

open之后需要调用XML的send方法(若是使用open中使用的是POST方法,需要在send方法调用之前设置HTTEP的请求头部)

如下

xmlhttp.open("POST","XXXXXX",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("name = kuye");

当open方法的method设置为GET时,XML请求所需要的一些参数通过拼接在URL后面来传递给服务器;当使用POST时,所需要的参数需要封装成一个对象,这个对象作为send()的参数传递给服务器。(使用GET时,send参数为空)

此时,对服务器的请求已经发送出去,然后需要监听服务器的状态,和设置回调函数获取服务器响应的数据

XML的onreadystatechange方法封装了对服务器的监听功能,每当 readyState 改变时,就会触发 onreadystatechange 事件,一般监听readyState==4&&status ==200时,此时请求已完成且响应就绪,如下

XHR.onreadystatechange = function()
{
	if(XHR.readyState ==4&&XHR.status ==200) //readyState == 4时,说明服务器响应完毕
	{	
		var data = XHR.responseText //XHR.responseText方法获取服务器返回的字符串型文本,XHR.responseXML方法获取服务器返回的XML型数据
		//接下来通过服务器返回的数据去做一些数据解析和HTML操作,就可以不加载整个页面,局部刷新网页了	
	}
}

 

 

 

 


)方法,