Ajax学习2
一段代码：
<SCRIPT LANGUAGE="JavaScript">
var bloglist=new Array();
var xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
function startload()
{
xmlHttp.open("GET", "http://www.blogjava.net/zbw25/Rss.aspx", true);
xmlHttp.onreadystatechange=function()
{
if (xmlHttp.readyState==4&&xmlHttp.status==200)
{
var xmldom=xmlHttp.responseXML;
var channel=xmldom.documentElement.childNodes.item(0);
var itemlist=channel.childNodes;
for(var i=0;i<itemlist.length;i++)
{
var node=itemlist.item(i);
if(node.tagName=="title")
{
blogtitle.innerHTML=node.text;
}
if(node.tagName=="link")
{
bloglink.href=node.text;
}
if(node.tagName=="description")
{
blogdescription.innerHTML=node.text;
}
if(node.tagName=="managingEditor")
{
managingEditor.innerHTML=node.text;
}
if(node.tagName=="item")
{
bloglist[bloglist.length]=node.childNodes;
}
}
showitem(bloglist[0]);
}
}
xmlHttp.send(null);
}
function showitem(itemlist)
{
for(var i=0;i<itemlist.length;i++)
{
var node=itemlist.item(i);
if(node.tagName=="title")
{
itemtitle.innerHTML=node.text;
}
if(node.tagName=="link")
{
itemlink.href=node.text;
}
if(node.tagName=="description")
{
description.innerHTML=node.text;
}
if(node.tagName=="author")
{
author.innerHTML=node.text;
}
if(node.tagName=="pubDate")
{
pubDate.innerHTML=node.text;
}
}
}
</SCRIPT>
<body onload="startload()">
<font color="blue"><a id="bloglink" href="#"><div id="blogtitle"></div></a></font>
<br>
By <font color="blue"><div id="managingEditor"></div></font>
<br>
<font color="blue"><div id="blogdescription"></div></font>
<br>
<br>
<font color="#000066"><a id="itemlink" href="#"><div id="itemtitle"></div></a></font><br>
By <font color="blue"><div id="author"></div></font><br>
<div id="description"></div><br>
<div id="pubDate" align="right"></div>
</body>
xmlHttp.status==200
以后都推荐像这样写。因为xmlHttp.status==200，代表服务器端返回的是正确的结果，这样才有可能正确的解析XML
responseXML
第9行的程序是这样的：var xmldom=xmlHttp.responseXML;
一个XMLHttpRequest，在顺利读取了数据之后，我们其实可以有四种方法，
得到这个数据。responseText只是其中一种。另外还有三种：
responseText 将响应信息作为字符串返回
responseXML 将响应信息格式化为XMLDOM对象并返回
responseBody 将响应信息以unsigned byte数组的形式返回
responseStream 将响应信息以IStream对象的形式返回
其中我们需要深入了解的，只有responseText 和responseXML 两种，至于
responseBody和responseStream，基本上可以不用考虑。
对于所谓AJAX应用，其实主要的工作，就是在浏览器客户端与服务器端之间，传递各种XML数据。如果要自己读取String数据，然后再全部自己手工解析XML，那就会非常复杂；而使用responseXML，就可以直接得到一个已经解析好了的XML DOM，这样就很方便了。
XMLDOM相关API
就算是直接得到了XMLDOM，事情也还没有结束。我们还需要运用XMLDOM提供的API，来正确的读取其中的数据。XMLDOM实在是太多内容了，这里只介绍这段程序里用到的API吧。
XMLDOM树：一个XMLDOM，其实是一个内存中的树，一个XML数据
中的每一个<>中的第一个单词，就代表着一个节点。比如：
<rss>
<channel/>
</rss>
<channel />，就代表channel节点。如果channel这个节点，直接以/>结尾，
那么它就不包含子节点。而rss节点，就是一个包含子节点channel的节点。我们
也可以说，rss是channel的父节点，channel就是rss的子节点。根节点，就是没
有父节点的节点，也就是顶层节点。
documentElement：这样就能够得到一个XML DOM树的根节点，具体到
我们想要分析的RSS文档，就是rss那个节点。
childNodes与item：这样就能够得到一个节点的所有子节点，以一个数组
的形式返回。
1 var childs=node.childNodes;
2 alert(childs.length);
3 var itemnode=childs.item(0);
上面的childs就是一个JavaScript的数组，我们可以通过childs.length，得
到这个数组的长度。也可以通过item(int)，得到其中的某一个元素，这个元素，
自然也是一个节点。
tagName：可以获得一个节点的名称。<rss>的tagName自然就是rss，<title>
的tagName，自然就是title。我们的程序就是通过判断tagName，来识别信息的。
text：就是一个节点包含的内容。比如< author>读书、思考、生活</ author>。
那么这个节点的text，就是 读书、思考、生活。
OK，就说这么多，XML DOM API当然不会这么简单，不过在现在这个程
序里，我们用到的也就只有这么多。
innerHTML与href
比如程序的第15行：blogtitle.innerHTML=node.text;
第18行：bloglink.href=node.text;
其实我们可以发现innerHTML与XML DOM中的node.text，有某种相似之
处。在初始的页面上，我们写着：
<font color=blue><a id="bloglink" href="#"><div id="blogtitle"></div></a></font>
这样的内容，在静态的HTML页面里，其实什么都看不到。但是有了<a
id="bloglink">和<div id="blogtitle">这样的两个元素，我们就可以借助JavaScript
对于HTML DOM的访问能力，动态的在页面里显示出内容来。
blogtitle.innerHTML="test";
就相当于
<div id="blogtitle">test</div>
而
bloglink.href="url";
就相当于
<a id="bloglink" href="url">
这就是初步的动态HTML(DHTML)了。
