月度存档: 11月 2005

[JavaScript] 静态的动态续篇之来点XML

在搞定了基本的伪动态之后,我马上把它应用到了网站,但随后就发现了一个问题:我如何来管理新闻列表呢?要是让我在每次要加新闻时去修改源文件然后再上传我可是千万个不愿,不仅麻烦而且容易出错,懒人怎么能可以这么做。动动脑子,于是想到了用XML,这个早已存在,但近些年才流行起来的技术。

在HTML里,可以使用数据岛来使用XML数据,一个使用方法就是在HTML里加入一句:

<xml id="data">

<!-- 在此为XML数据 -->

</xml>

这样,就可以在HTML里使用XML提供的数据。不过,这样还是显得麻烦了,还是要上传整个文件,那么用方便点的吧~~

<xml id="data" src="data.xml"/>

这样处理之后,我就可以只用修改一个XML文件然后上传到服务器了。

接下来,就是搞定在客户端对XML数据的处理了~~

首先,我得设计一个新闻的数据结构。这个简单,毕竟在列表时只需要用到新闻的标题和时间,但为了链接,需要加上一个ID,结果如下:

<newslist>

<news>

<id>1</id>

<title>第一个新闻</title>

<date>2005-11-16</date>

</news>

</newslist>

数据结构搞定了,继续!

在客户端对数据处理当然首选JavaScript了,再么这篇文章讲的也是用JavaScript来实现伪动态。

在JS里,对数据岛的访问可以使用记录集:

var rs=data.recordset;

这个记录集的使用方法和ASP中类似,这下方便我了:),可以很方便地实现新闻的列表及链接了~在显示新闻,还需要显示的是上一条新闻的标题及下一条新闻的标题,而且显示新闻列表时,就不需要显示上一条及下一条新闻了。于是我放了两个层分别用来显示新闻和上一条及下一条新闻的信息,并在需要的时候设置是否显示。其中newsmain用来显示新闻或者新闻列表,newspage用来显示上一条及下一条新闻的信息。接着把对应ID的新闻存为网页文件,在显示时使用iframe嵌入。

先写个函数来从网址中获取新闻ID,这个在前一篇文章已经讲过,拿来用~~

function getid() {

var str,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);   // …

阅读全文 »

[JavaScript] 静态的动态

这段时间因为要做个网站,而空间又不支持ASP,所以又拿起JavaScript教程看了下,看能不能在静态的空间里实现动态,当然,这个动态不是真正意义上的了,可以说只是一个“伪动态”了:)

最基本的动态页面的功能,莫过于news.asp?id=1这样的形式了,于是我就拿这个目标开工,弄了一会还真有些成效~基本构思是:从浏览器的地址栏获取当前文件的地址,然后从其中提取id,最后用内嵌框架来显示相关内容。以下是基本的代码

<script>
var str,len,pos,id,fn;     // 定义一些变量
str=top.window.location.href;    //获取当然文件地址
len=str.length;     // 得到地址长度
pos=str.indexOf("?id=",0);   // 得到"?id="的起始地址
if(pos>0)   // 判断是否存在"?id="
{
id=str.substring(pos+4,len);   // 获取ID
fn="<iframe src='news/" + id + ".htm'></iframe>"  // 在内嵌框架里显示相关内容
document.write(fn);   // 输出
} else {
document.writeln("错误的参数!");  // 不存在ID
}
</script>

这样,就可以把新闻做成页面放在news目录,然后在外部调用news.htm?id=1就可以来查看相关的新闻了~~

当然这里的代码并不成熟,比如没有判断ID是否为数字等,这等以后去慢慢完善了:)