Ajax的五个步骤（最原始的）

最新推荐文章于 2021-03-11 15:22:59 发布

原创最新推荐文章于 2021-03-11 15:22:59 发布 · 1.5k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #xmlhttprequest #javascript #callback #服务器 #url

dwr_ajax_jquery 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了使用JavaScript实现AJAX的基本步骤：创建XMLHttpRequest对象、与服务器进行交互、发送请求及处理响应。详细展示了如何根据不同内容类型解析返回的数据。

1.创建xmlhttp对象
var req;

if(window.XMLHttpRequest) {
	req = new XMLHttpRequest();
		if(req.overrideMimeType) { //针对某些特定版本的mozillar浏览器的BUG进行修正
		req.overrideMimeType("text/xml");
	}
} else if(window.ActiveXObject) { //针对ie5.ie4,ie6
	var activexName = ["Microsoft.XMLHTTP","Msxml2.XMLHTTP"];
	for(var aname in activexName) {
		req = new ActiveXObject(aname);
		break;
	}
}

2.与服务器交互
req.open("GET",URL,true);//第三个参数表示同步还是异步（true表示异步）

3.传递参数get的时候将其设置成null
req.send(null);

4.回来的时候调用的函数。
req.onreadystatechange = callback;

function callback() {
5.回应信息成功
	if(req.readyState == 4) { //表示服务器数据返回
		if(req.status == 200) {
			//表示返回成功
			var datas;
			switch(req.getResponseHeader("Content-Type")) {
				//针对不同的信息，解析不一样。
				case "text/xml" : datas = req.reponseXML;break;
				case "text/json":
		    case "text/javascript":
		    case "application/javascript":
		    case "application/x-javascript":
		        // If the response is JavaScript code, or a JSON-encoded value,
		        // call eval() on the text to "parse" it to a JavaScript value.
		        // Note: only do this if the JavaScript code is from a trusted server!
		        datas = eval(request.responseText); //解析文本成html
		
		    default:
		        // Otherwise, treat the response as plain text and return as a string.
		        datas = request.responseText;

}
		} else (req.status == 404) {
		  //找不到url
		}
	}
}