原生ajax调用数据简单实例代码

原生ajax调用数据简单实例代码:
由于jQuery的盛行，现在使用较多的是jQuery封装好了的ajax，因为解决了浏览器兼容性问题，这对程序员来说就等于去掉了一个心头大患，但并非原生ajax就销声匿迹，并且本人感觉还是对原生的ajax有所了解的好，下面就是一段ajax数据调用的实例代码，非常的简单，初学者可以参考一下。代码如下:
一.兼容浏览器部分:

function xmlHttpR()
{
  var xmlhttp;
  if(window.XMLHttpRequest)
  {
    xmlhttp=new XMLHttpRequest();
  }
  else
  {
    try
    {
      xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")
    }
    catch(e)
    {
      try{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }
      catch(e){return null;}
    }
  }
  return xmlhttp;
} 

以上能够返回一个兼容各个浏览器的对象。
二.实例代码:

var ajaxEl=new Object();
//ajaxEl是自定义的命名空间；
ajaxEl.contentLoad=function(url)
{
  //IE浏览器下，会启用缓存，这里url加入date字段就是为了防止IE使用缓存，当然也可以使用Math.random()产生和getTime类似的效果；
  url+="?date="+new Date().getTime();
  this.req=null;
  this.url=url;
  //这个回调函数就是在数据在页面上的更新函数；
  this.onload=function()
  {
    //domEl是ID为#test的dom元素；
    var domEl=document.getElementById("test");
    //除了用responseText属性，也可以使用responseXml获得一张数据表；
    domEl.innerHTML=this.req.responseText;
  }
  this.Xmlhttp(url);
}
ajaxEl.contentLoad.prototype={
  Xmlhttp:function(url){
    if(window.XMLHttpRequest)
    {
      this.req=new XMLHttpRequest();
    }
    else
    {
      try{this.req=new ActiveXObject("Msxml2.XMLHTTP")}
       catch(e)
       {
         try{this.req=new ActiveXObject("Microsoft.XMLHTTP");
       }
       catch(e){return null;}
    }
  }
  if(this.req)
  {
    var xmlR=this;
    this.req.onreadystatechange=function(){
      if(xmlR.req.readyState===4)
      {
        xmlR.onload.call(xmlR);
      }
    }
    this.req.open("GET",url,true);
    this.req.send(null);
  }
 }
}
var xmlE=new ajaxEl.contentLoad("main.php"); 

三.php中的代码:

echo "now! time is:".date("H:i:s a Y");

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9369

更多内容可以参阅:http://www.softwhy.com/javascript/