function ajax(url,fnSucc,fnFild){
//1.创建对象
var oAjax=null;
if (window.XMLHttpRequest) {
oAjax=new XMLHttpRequest();
}else{
oAjax=new ActiveXObject("Microsoft.XMLHTTP");
}
//2.连接服务器
oAjax.open("GET",url,true);
//3.发送请求
oAjax.send();
//4.接收数据
oAjax.onreadystatechange=function(){
if (oAjax.readyState==4) {
if (oAjax.status==200) {
fnSucc(oAjax.responseText);
}else{
if (fnFild) {
fnFild();
}
}
}
}
}
1、 if (window.XMLHttpRequest) {
oAjax=new XMLHttpRequest();
}else{
oAjax=new ActiveXObject("Microsoft.XMLHTTP");
}
如果参数未定义会出错，如果属性未定义则为underfind；所以XMLHttpRequest前要加window。其中new ActiveXObject("Microsoft.XMLHTTP")为IE浏览器获取对象特有，其他浏览器则是new XMLHttpRequest()。
2、oAjax.open("GET",url,true);服务器通信方式有两种，一种是get方式，另一种是post方式，get方式把数据放在url中，post则不是。服务器为异步通信，所以用true。
3、当ajax与服务器通信时调用onreadystatechange函数。
4、readyState属性表示请求状态，有5种状态，分别为：
（1）0（未初始化）还没有调用open方法。
（2）1（载入）已调用send方法，正在发送请求。
（3）2（载入完成）send（）方法完成，已收到全部相应内容。
（4）3（解析）正在解析相应内容。
（5）4（完成）相应内容解析完成，可在客户端调用。
5、status属性：表示请求结果，其中成功为200，未找到为404。
6、responseText属性：表示返回结果，从服务器返回内容。
7、调用ajax函数如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>自创ajax</title>
<script src="new_ajax.js"></script>
<script>
window.onload=function(){
var oBtn=document.getElementById("btn");
oBtn.onclick=function(){
ajax("page1.txt",function(str){
alert(str);
});
}
}
</script>
</head>
<body>
<input type="button" value="点击从服务器获取文件" id="btn">
</body>
</html>
