用XMLHttpRequst对象实现真实的网页加载进度

< script  type ="text/javascript" >
<!--
// 3个用于实现无刷新数据读取的函数
var  xmlHttp ;
// 用来记录setTimeout返回值
var  TimeoutId;
function  createXMLHttpRequest() 
{
  if (window.ActiveXObject) 
 {
  xmlHttp  =   new  ActiveXObject( " Microsoft.XMLHTTP " );
 }
  else   if (window.XMLHttpRequest) {
  xmlHttp  =   new  XMLHttpRequest();
 }
}

function  startRequest() 
{
 createXMLHttpRequest();
  var  url  =   " http://www.163.com " ;
 xmlHttp.onreadystatechange  =  handleStateChange;
 xmlHttp.open( " GET " ,url, true );
 xmlHttp.send( null );
 TimeoutId = setTimeout( " startRequest() " , 1000 );
  // alert(TimeOutId);
}

function  handleStateChange() 
{
  if (xmlHttp.readyState  ==   1 ) 
 {
  document.getElementById( " msg " ).innerHTML  =   " 正在连接服务器...... " ;
 }
  else   if (xmlHttp.readyState  ==   2 ) 
 {
  document.getElementById( " msg " ).innerHTML  =   " 正在加载信息...... " ;
 }
  else   if (xmlHttp.readyState == 3 )
 {
   document.getElementById( " msg " ).innerHTML  =   " 数据交互中，请稍后...... " ;
 }
  else   if (xmlHttp.readyState  ==   4 ) 
 {
   if (xmlHttp.status  ==   200 ) 
  {
    // document.getElementById("show").innerHTML = xmlHttp.responseText;
   document.getElementById( " msg " ).innerHTML = " 加载完毕 " ;
   document.clear();
   document.write(xmlHttp.responseText);
   location.reload();
   //  document.getElementById("show").innerHTML = xmlHttp.responseText;
   // 停止执行setTimeout()
   clearTimeout(TimeoutId);
  }
   else
  {
   document.getElementById( " msg " ).innerHTML  =   " 数据读取失败，请稍后再试...... " ;
  }
 } 

}
// -->
</ script >
< body  onload ="startRequest();" >
< div  id ="msg" >
</ div >
< div  id ="show" >
</ div >
</ body >