使用回调函数监视请求

<html>
<head>

<script type='text/javascript'>

var req=null;
var console=null;  
var READY_STATE_UNINITIALIZED=0;
var READY_STATE_LOADING=1;
var READY_STATE_LOADED=2;
var READY_STATE_INTERACTIVE=3;
var READY_STATE_COMPLETE=4;//表明请求已经完成

function loadXMLDoc(url) {
    if (window.XMLHttpRequest) {   
        req = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        req = new ActiveXObject("Microsoft.XMLHTTP");
    }
    if (req) {
        req.onreadystatechange = processReqChange;
        req.open("GET", url, true);
        req.send(null);
    }

}

function processReqChange(){
  var ready=req.readyState;
  var data=null;
  if (ready==READY_STATE_COMPLETE){
    data=req.responseText;
  }else{
    data="loading...["+ready+"]";
  }
  toConsole(data);
}


function toConsole(data){
  if (console!=null){
    var newline=document.createElement("div");
    console.appendChild(newline);
    var txt=document.createTextNode(data);
    newline.appendChild(txt);
  }
}
//回调函数:设置一个入口点,以便在调用结束的时候可以获取结果,也就是说,
//在未来的某个不确定时刻,当结果返回的时候,将会执行这一段代码。
//window.onload函数就是一个回调函数
//回调函数非常适合用于大多数现代UI工具箱中的事件驱动的编程方法。按下键盘、点击鼠标等等,
//这些事件都将会在未来某个无法预测的时刻发生,程序员预见到了这一点,并且为这些事件写好了处理函数。
//在用JavaScript编写用户界面的事件处理代码时,我们将函数分配给onkeypress、onmouseover或者对象上的类似属性。
//在为服务器请求的回调函数编写代码时,我们见到过称作onload和onreadystatechange的类似属性。
window.onload=function(){
  console=document.getElementById('console');
  loadXMLDoc("data.txt");
}
</script>

</head>
<body>
<div id='console'></div>
</body>
</html>

 

你可能感兴趣的:(使用回调函数监视请求)