用xslt+xml+javascript+css实现的菜单
1、xml文件
<?xml version='1.0' encoding='utf-8'?>
<?xml:stylesheet type='text/xsl' href='menu.xsl'?>
<Menu>
<item>
<p_id>00</p_id>
<menu_id>01</menu_id>
<menu_name>供应商信息查询</menu_name>
<link_name></link_name>
<infor>点击改变目录层次</infor>
<url></url>
<memo></memo>
</item>
<item>
<p_id>01</p_id>
<menu_id>0101</menu_id>
<menu_name></menu_name>
<link_name>库存明细查询</link_name>
<infor>库存明细查询</infor>
<url>./kcmx.aspx</url>
<memo></memo>
</item>
<item>
<p_id>01</p_id>
<menu_id>0102</menu_id>
<menu_name> </menu_name>
<link_name>库存汇总查询</link_name>
<infor>库存汇总查询</infor>
<url>./kchz.aspx </url>
<memo></memo>
</item>
<item>
<p_id>00</p_id>
<menu_id>02</menu_id>
<menu_name>业务情况处理</menu_name>
<link_name></link_name>
<infor>点击改变目录层次</infor>
<url></url>
<memo></memo>
</item>
<item>
<p_id>02</p_id>
<menu_id>0201</menu_id>
<menu_name></menu_name>
<link_name>采购信息处理</link_name>
<infor>采购信息处理</infor>
<url>./cgxx.aspx</url>
<memo></memo>
</item>
<item>
<p_id>02</p_id>
<menu_id>0202</menu_id>
<menu_name></menu_name>
<link_name>退货信息处理</link_name>
<infor>退货信息处理</infor>
<url>./thxx.aspx</url>
<memo></memo>
</item>
</Menu>
2、xsl文件
<?xml version='1.0' encoding='utf-8'?>
<xsl:stylesheet version = '1.0'
xmlns:xsl='http://www.w3.org/1999/XSL/Transform'>
<!--变量定义-->
<xsl:variable name='FirstMenuSeg'>0</xsl:variable><!--第一层菜单的顺序-->
<xsl:template match='/'>
<html>
<head><title>menu</title>
<script lanaguage='javascript' src='menu.js'/>
<link rel='stylesheet' href='menu.css' type='text/css'/>
</head>
<body>
<xsl:apply-templates select='Menu'/>
</body>
</html>
</xsl:template>
<xsl:template match='Menu'>
<table id='frm' width='100%' height='100%' cellspacing='2' cellpadding="2">
<tr>
<td>
<table id='frm_top' cellspacing='0' cellpadding="0" width="158" align="center">
<tr>
<td valign="bottom" height="42"><img height='38' width='158' border="0" src="images/Admin/title.gif"/></td>
</tr>
<tr>
<td class="menu_title" background="images/Admin/title_bg_quit.gif" height="25">
<span>
<a><b><font color="215DC6"> 首页 </font></b></a>
<a><b><font color="215dc6"> 登陆 </font></b></a>
<a><b><font color="215dc6"> 注销 </font></b></a>
<a><b><font color="215dc6"> 重载 </font></b></a>
</span>
</td>
</tr>
<tr>
<td align="center">
<font class="navPoint">5</font>
<font class="navPoint">6</font>
</td>
</tr>
</table>
<xsl:call-template name='firstMenu'/>
</td>
<!--xml部分-->
</tr>
<tr>
<td valign="bottom">
<table id='frm_bottom' cellspacing='0' cellpadding="0" width="158" align="center" >
<tr>
<td align="center">
<font class="navPoint">5</font>
<font class="navPoint">6</font>
</td>
</tr>
</table>
</td>
</tr>
</table>
</xsl:template>
<!--循环-->
<!--
<xsl:template name="firstitems">
<xsl:for-each select='item[string-length(menu_id)=2]'>
<xsl:variable name='varpid' select='menu_id'/>
<xsl:call-template name='seconditems'>
<xsl:with-param name='pid' select="$varpid"/>
</xsl:call-template>
</xsl:for-each>
</xsl:template>
-->
<!--第二
<xsl:template name='seconditems'>
<xsl:param name='pid'/>
<xsl:apply-templates select='//item[p_id=$pid]'/>
</xsl:template>
-->
<!--原始数据(实现递归)
<xsl:template match ="item">
<tr onclick="cs(this.id)">
<xsl:attribute name="id"><xsl:value-of select ='menu_id'/></xsl:attribute>
<td><xsl:value-of select ='p_id'/></td>
<td>
<xsl:value-of select ='menu_id'/>
</td>
<td><xsl:value-of select ='menu_name'/></td>
<td><xsl:value-of select ='link_name'/></td>
<td><xsl:value-of select ='infor'/></td>
<td><xsl:value-of select ='url'/></td>
<td><xsl:value-of select ='memo'/></td>
<xsl:variable name='varpid' select='menu_id'/>
<xsl:call-template name='seconditems'>
<xsl:with-param name='pid' select="$varpid"/>
</xsl:call-template>
</tr>
</xsl:template>
-->
<xsl:template name='firstMenu'>
<table id='frm_center' cellspacing='0' cellpadding="0" width="158" align="center">
<xsl:for-each select='item[string-length(menu_id)=2]'>
<!--记录循环的次数-->
<tr onclick='cs(this.id)'>
<xsl:attribute name='id'><xsl:value-of select='menu_id'/></xsl:attribute>
<td class='menu_title' height='25'>
<xsl:attribute name='background'>
<xsl:text>images/Admin/admin_left_1.gif</xsl:text>
</xsl:attribute>
<xsl:value-of select="menu_name"/>
</td>
</tr>
<tr>
<td>
<xsl:variable name='pid' select='menu_id'/>
<xsl:call-template name='secondMenu'>
<xsl:with-param name='pid' select='$pid'/>
</xsl:call-template>
</td>
</tr>
<tr height='20'/>
</xsl:for-each>
</table>
</xsl:template>
<!--第二级菜单-->
<xsl:template name='secondMenu'>
<xsl:param name='pid'/>
<table class='sec_menu' style="WIDTH: 158px">
<xsl:attribute name='id'>
<xsl:value-of select="$pid"/><xsl:text>_menu</xsl:text>
</xsl:attribute>
<xsl:for-each select="//item[p_id=$pid]">
<tr>
<td><xsl:value-of select="menu_name"/></td>
<td><xsl:value-of select="link_name"/></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
3、javascript和Css部分较为简单,不再赘述