天天看点

用XMLHttpRequest对象打造AJAX

用XMLHttpRequest对象打造AJAX

不同浏览器对XMLHttpRequest对象的具体实现和具体使用不太一样,比如创建一个XMLHTTP对象实例,IE和其他浏览器就不同

另外需要注意的是 request.readyState 的readyState 中第二个单词就要大写开头,就是说S要大写,不然在IE下依然有效,但是其他浏览器可就失效了

调试的时候尽量在服务器调试,本地调试可能IE 火狐有效 Chrome就会失效

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>ajax</title>
<style>
*{
	margin:0;
	padding:0;
}
body{
	margin:10px 10%;
	background:#666;
}
div{
	color:#FFF;
}
</style>
</head>

<body>
<div></div>
<script>
function getHTTPObject(){
	if(window.ActiveXObject){
		var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");/*IE浏览器*/
	} else if(window.XMLHttpRequest){
		var xmlhttp = new XMLHttpRequest();/*其他浏览器*/
	} else {
		var xmlhttp = false;
	}
	return xmlhttp;
}
function changeDiv(){
	if(request.readyState==4){/*0尚未初始化 1正在加载 2加载完毕 3正在处理 4处理完毕*/
		document.getElementsByTagName("div")[0].innerHTML = request.responseText;/*返回内容*/
	}
}

var request = getHTTPObject();/*创建XMLHttpRequest对象实例*/
request.open("GET","txt.txt",true);/*GET POST SEND 3种请求类型,第二个是请求地址,第三个参数决定是否用异步方式处理这个请求*/
request.onreadystatechange = changeDiv;/*服务器对请求的处理进度监听*/
request.send(null);/*发送请求*/
</script>
</body>
</html>
           

继续阅读