Ajax(Asynchronous javascript + XML)的定义】
Ajax并不是一种技术。它实际上是几种已经在各自领域大行其道技术的强强结合。Ajax混合了:
* 基于XHTML/CSS
* 由DOM(Document Object Model)实现动态显示与交互
* 通过XML和XSLT进行数据交换及处理
* 使用javascript整合上述技术
其实这个技术很早的时候就有了.只是一直没有得到广泛的运用. Google给我们带了头, Gmail就是个很好的例子,除了Gmail外,还有suggest Google 和 Google Map
XMLHttpRequest 是 Ajax 的关键技术.javascript也是靠 XMLHttpRequest 来获取XML的. 现在我们来看看如何建立 XMLHttpRequest 对象,然后读取XML.
Mozilla和IE同样支持 XMLHttpRequest ,不过在使用过程中是不一样的.
- Mozilla 浏览器自带了 XMLHttpRequest 接口
new XMLHttpRequest()
- 而 IE 需要使用ActiveX对象来建立.
new ActiveXObject("Microsoft.XMLHTTP")
XMLHttpRequest 的常用属性和方法
属性
onreadystatechange
readyState
responseText
responseXML
status
statusText
方法
abort()
getAllResponseHeaders()
getResponseHeader("")
open("", "URL"[,asyncFlag[, ""[,""]]])
send(content)
setRequestHeader("", "")
下面开始我们的程序,为了方便使用 XML 我把操作XML的方法用一个 function 封装起来
function XMLHttpObject(url,Syne){
var XMLHttp=null
var o=this
this.url=url
this.Syne=Syne
this.sendData = function()
{
if (window.XMLHttpRequest) {
XMLHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
with(XMLHttp){
open("GET", this.url, this.Syne);
onreadystatechange = o.CallBack;
send(null);
}
}
this.CallBack=function()
{
if (XMLHttp.readyState == 4) {
if (XMLHttp.status == 200) {
//Xml加载成功后的操作
}
}
}
this.getText=function()
{
if (XMLHttp==null) {return "还没加载 XMLHttpRequest"}
if (XMLHttp.readyState==4) {return XMLHttp.responseText}
return XMLHttp.readyState
}
}
- 现在我们根据上面写好的Function建立一个XML对象
var XMLDoc1=new XMLHttpObject("1.xml",true)
- 发送数据,这个过程将调用 XMLHttpRequest 来对 1.xml 进行request
XMLDoc1.sendData()
- 当加载完成后,可以用下面的方法获取 XML 文档的文本内容了
XMLDoc1.getText()
这样 XMLHttpRequest 建立基本上完成了.