用XML实现弹出式菜单

<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 728x15, 创建于 08-4-23MSDN */google_ad_slot = "3624277373";google_ad_width = 728;google_ad_height = 15;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>

<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 160x600, 创建于 08-4-23MSDN */google_ad_slot = "4367022601";google_ad_width = 160;google_ad_height = 600;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>

XML已经成为了新一代网络计算的世界语,这一点已经在各大软件公司的产品中逐步体现出来。XML本身并不是一种计算语言,而更多表现为一种数据描述的格式。相对于HTML,它更多具有数据定义的特性,而相对于数据库,它又更加灵活和适于在网络上传输。围绕XML的相关技术也层出不穷,如XSL, XSLT等,它们的配合让我们能够真正在XML上开始完成一些有趣的任务。

本文就是以一个XML初学者的角度在网页上实现一个动态弹出式菜单。对于同样希望了解XML与表现无关的特性的读者应当有所帮助。

应用情景

我们经常在一些网站看到形形色色的菜单形式,大部分的菜单都借用了DHTML的一些特性实现,但是想好好地利用这些已有的菜单实现一些自己的菜单并不容易。首先是必须从它们的整个页面中把一些代码“分析”,其次要分析其中的显示方式与显示内容的关系,如果自己的菜单结构和显示方式不同于其它网站的设计,就得花更多的功夫去研究新的显示方法。

而我们希望实现一个可以动态调整的菜单结构,这种菜单应当可以适用于我们所要完成的整个一个网站。一旦我们的网页页面设计发生了变化,我们可以灵活地把菜单显示方式改变,适应新的网页整体风格。
我们所希望实现的菜单首先可以表现为以下样子:

图1:我们想实现的弹出式菜单的一种外观

实现方法

在大量接触HTML后,今天的网页程序设计中我们更多地愿意直接把一个页面的样子用所见即所得的编辑工具(如Frontpage, Dreamweaver等)“画”出来,而不再习惯于利用数据结构的方式设计能够通用的模块。为了能够达到我们的目的,我们又一次地开始重新考虑如何定义一个通用的菜单数据结构来描述一个菜单的信息,然后再使用一个显示模块表现这些数据信息,如果改变显示模块的一些参数,就可以实现相同菜单内容的不同外观和行为。

在了解了XML的基本定义方法之后,我们定义了如下的示范数据:

<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 728x15, 创建于 08-4-23MSDN */google_ad_slot = "3624277373";google_ad_width = 728;google_ad_height = 15;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>

<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 160x600, 创建于 08-4-23MSDN */google_ad_slot = "4367022601";google_ad_width = 160;google_ad_height = 600;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>