在HTML里,可以使用数据岛来使用XML数据,一个使用方法就是在HTML里加入一句:
这样,就可以在HTML里使用XML提供的数据。不过,这样还是显得麻烦了,还是要上传整个文件,那么用方便点的吧~~
这样处理之后,我就可以只用修改一个XML文件然后上传到服务器了。
接下来,就是搞定在客户端对XML数据的处理了~~
首先,我得设计一个新闻的数据结构。这个简单,毕竟在列表时只需要用到新闻的标题和时间,但为了链接,需要加上一个ID,结果如下:
数据结构搞定了,继续!
在客户端对数据处理当然首选JavaScript了,再么这篇文章讲的也是用JavaScript来实现伪动态。
在JS里,对数据岛的访问可以使用记录集:
varrs=data.recordset;
这个记录集的使用方法和ASP中类似,这下方便我了:),可以很方便地实现新闻的列表及链接了~在显示新闻,还需要显示的是上一条新闻的标题及下一条新闻的标题,而且显示新闻列表时,就不需要显示上一条及下一条新闻了。于是我放了两个层分别用来显示新闻和上一条及下一条新闻的信息,并在需要的时候设置是否显示。其中newsmain用来显示新闻或者新闻列表,newspage用来显示上一条及下一条新闻的信息。接着把对应ID的新闻存为网页文件,在显示时使用iframe嵌入。
先写个函数来从网址中获取新闻ID,这个在前一篇文章已经讲过,拿来用~~
functiongetid(){
varstr,len,pos,id,fn;//定义一些变量
str=top.window.location.href;//获取当然文件地址
len=str.length;//得到地址长度
pos=str.indexOf("?id=",0);//得到"?id="的起始地址
//判断是否存在"?id="
if(pos>0){
id=str.substring(pos+4,len);//获取ID
returneval(id);//返回数值类型的ID,方便处理
}
else{
return0;//错误参数,返回0,显示新闻列表
}
}
再来个函数处理进入页面时执行什么动作,是显示新闻列表还是显示相应ID的新闻
functionshowmain(){
varid;
id=getid();//获取新闻ID
//是0则显示列表
if(id>0){
rs.absoluteposition=id;//设置游标到指定的新闻
shownews(id);//显示新闻
}
else{
showlist();//显示新闻列表
}
}
显示新闻列表的函数
functionshowlist(){
varss="";//HTML
vari;//循环计数器
rs.movefirst();//移动到第一个记录
//循环读取新闻记录
for(i=0;i ss=ss+" ";//添加一个新闻 rs.movenext();//移动到下一条一新闻 } document.all.newsmain.innerHTML=ss;//在新闻显示区输出新闻 document.all.newspage.style.visibility="hidden";//显示新闻列表时,不显示前后新闻的信息 } 显示指定的新闻,并显示前后新闻的信息 functionshownews(id){ varps;//用于存放前后新闻的信息 document.all.newsmain.innerHTML=" document.all.newspage.style.visibility="visible";//使前后新闻信息可见 rs.absoluteposition=id;//将记录游标移动到当前新闻 //如果ID小于1说明是第一条记录,上一篇新闻就是“没有了”:) if(id<=1){ ps="上一篇:没有了"; } //否则就显示上一篇新闻的标题 else{ rs.moveprevious();//记录游标向前移动 ps=" rs.movenext();//恢复记录游标 } ps=ps+"";//在两个信息之间插入一个空格 //如果ID大于记录总数说明这是最后一个新闻了~ if(id>=rs.recordcount){ ps=ps+"下一篇:没有了"; } //否则显示下篇新闻的标题 else{ rs.movenext();//记录游标向前移动 ps=ps+" rs.moveprevious();//恢复记录游标 } document.all.newspage.innerHTML=ps;//显示前后新闻标题~ } 好了,到底算是基本完工了~具体使用可以这样来: 在head区加入XML数据岛
接着在body的onload事件里执行showmain()
还需要在body里加入两个层用于显示信息