Ajax 裸奔之一-技术开发专区

Ajax 裸奔之一

作者：emu 编辑：王竹岩 2006-05-31 17:14

　　第五步，我们继续修改页面，把xml从文件中独立出来，并让页面可以访问独立的xml文件并把它显示出来。

　　首先，确认第三步定义的xml已经保存为一个xml文件 news.xml.

　　然后页面就可以改成这样了：

　　step5.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb18030" />
    <meta name="Author" content="emu" />
    <meta name="Keywords" content="ajax" />
    <meta name="Description" content="Ajax裸奔-步骤5" />
    <title> 原型页面 </title>
    <script type="text/JavaScript">
    <!--
    var newsXML;
function init(){
newsXML = new ActiveXObject("microsoft.XMLDOM");
//创建XMLDOM对象，用以通过文件系统或者http连接访问xml文件
        newsXML.async= true; //规定XMLDOM对象采用异步方式加载数据
        newsXML.onreadystatechange= handleXML;
//指定加载到xml之后采用那个函数来处理xml数据
        newsXML.load("news.xml"); //开始装载xml数据
    }
function handleXML(){
if(newsXML.readyState==4)
document.body.innerHTML=newsXML.getElementsByTagName("data")[0].text;
}
//-->
    </script>
</head>
<body onload="init()">
</body>
</html>

　　确认news.xml和step5.html保存在同一个目录下，现在在IE中你已经可以看到你的第一个Ajax页面在工作了。

　　不过现在我们还没有通过http来访问xml，也还不能在非IE浏览器上运行这个应用，我们将在下篇文章中解决这两个问题。

第1页：Ajax的示范应用 1 第2页：Ajax的示范应用 2

关注我们