用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>