关于Ajax

      学习日记 2007-7-24 11:17

ajax是一种应用技术的缩写,全称为Asynchronous Javascript And XML ,这种技术的使用可以更好地提高用户

的体验。组成这种技术的主要因素有:javascript语言,css样式表,XMLHttpRequest数据交换对象和Dom对象。
XMLHttpRequest对象是ajax技术的关键,它是依附于浏览器的一个组件。在IE和firefox两种不同的浏览器中,

XMLHttpRequest对象的声明也不同,通常我们需要判断一下浏览器再创建对象,代码如下:
var xmlhttp;
function createRequest()
{
 if(window.ActiveXObject)
 {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 else if(window.XMLHTttpRequest)
 {
  xmlhttp=new XMLHttpRequest();
 }
}

创建好http对象后,下一个步骤是加载数据所在的服务器。ajax可以从其他网站获取数据,也可以从xml中获取,

语法如下:
xmlHttp.open(method,url,bool);
method 表示http的请求方法,一共有5种方法:get,post,head,put,delete,其中比较常用的是get和post。
url表示数据的地址,如果是本地地址就指定具体的路径,如果是其他的网站的数据就指定完整的url地址。
bool表示是否使用异步获取,true表示异步,false表示同步。如下:
xmlHttp.open("get","http://blog.csdn.net/oec2003",true);
xmlHttp.open("get","oec2003.xml",true);
在异步调用开始请求前,需要将状态改变时的事件和jacascript定义的方式挂钩,如下:
<script language="javascript">
 xmlHttp.onreadystatechange=oec;
 function oec()
 {
  //4表示异步调用完成,200表示异步调用成功
  if(xmlhttp.readystate==4 && xmlhttp.states==200)
  {
   alert("哈哈,异步调用成功");
  }
 }
当加载完请求后,还需要发送一个http请求,一般表示请求的数据。
xmlhttp.send(params);
其中params表示可选的参数,如果请求的数据不要参数可以直接在括号中写null。
最后就是处理异步获取的数据,数据的类型有两种: 文本型和xml类型。文本类型数据使用

XMLHttp.ResponseText获取,XML类型使用XMLHttp.ResponseXML获取。

//获得dataset的输出写法

function GetDataSet_callback(response){
   var ds = response.value;
   if(ds != null && typeof(ds) == "object" && ds.Tables != null){
     var s = new Array();
     s[s.length] = "<table border=1>";
     for(var i=0; i<ds.Tables[0].Rows.length; i++){
       s[s.length] = "<tr>";
       s[s.length] = "<td>" + ds.Tables[0].Rows[i].FirstName + "</td>";
       s[s.length] = "<td>" + ds.Tables[0].Rows[i].Birthday + "</td>";
       s[s.length] = "</tr>";
     }
     s[s.length] = "</table>";
     tableDisplay.innerHTML = s.join("");
   }
   else {
     alert("Error. [3001] " + response.request.responseText);
   }
}

标签集:TAGS:
回复Comments() 点击Count()

回复Comments

{commentauthor}
{commentauthor}
{commenttime}
{commentnum}
{commentcontent}
作者:
{commentrecontent}