导航组件实现：XML+XSLT+jQuery Accordion

1、xml数据格式（数据动态生成）：

1<?xml version="1.0" encoding="utf-8" ?>
2<menu>
3  <item text="Menu1" url="../default.aspx"/>
4  <item text="Menu2" url="#">
5    <subitem text="Menu21" url="http://www.baidu.com"/>
6    <subitem text="Menu22" url="http://www.eric.com"/>
7  </item>
8</menu>

2、XSL文件内容：

 1<?xml version="1.0" encoding="utf-8"?>
 2<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
 3    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">
 4    <xsl:output method="html" encoding="utf-8" indent="yes"/>
 5    <xsl:template match="/">
 6      <ul id="navigation" class="menu collapsible">
 7        <xsl:for-each select="//menu/item">
 8          <li>
 9            <a class="head" target="rightmain">
10              <xsl:attribute name="href">
11                <xsl:value-of select="@url"/>
12              </xsl:attribute>
13              <xsl:value-of select="@text"/>
14            </a>
15            <xsl:variable name="subItems" select="subitem"/>
16            <xsl:if test="count($subItems) &gt; 0">
17              <ul style="display:none;">
18              <xsl:for-each select="subitem">
19                  <li>
20                    <a target="rightmain">
21                      <xsl:attribute name="href">
22                        <xsl:value-of select="@url"/>
23                      </xsl:attribute>
24                      <xsl:value-of select="@text"/>
25                    </a>
26                  </li>                
27              </xsl:for-each>
28              </ul>
29            </xsl:if>
30          </li>
31        </xsl:for-each>        
32      </ul>
33    </xsl:template>
34</xsl:stylesheet>
35

3、目标html代码，为jQuery Accordion的js所用(可以使用上文中提及的jQuery组件)：

1<ul id="navigation" class="menu collapsible">
2  <li><a class="head" target="rightmain" href="../default.aspx">Menu1</a></li>
3  <li><a class="head" target="rightmain" href="#">Menu2</a>
4    <ul style="display:none;">
5      <li><a target="rightmain" href="http://www.baidu.com">Menu21</a></li>
6      <li><a target="rightmain" href="http://www.eric.com">Menu22</a></li>
7    </ul>
8  </li>
9</ul>

4、用于生成menu的c#代码（其他语言的代码类似）：

 1        XslCompiledTransform xsl = new XslCompiledTransform();
 2        xsl.Load(xslPath);
 3        MemoryStream msIn = new MemoryStream(Encoding.UTF8.GetBytes(strXML));
 4        MemoryStream msOut = new MemoryStream();
 5        msIn.Position = 0;
 6        XmlTextReader trInput = new XmlTextReader(msIn);
 7        XmlWriter twOutput = XmlWriter.Create(msOut, xsl.OutputSettings);
 8        xsl.Transform(trInput, twOutput);
 9        trInput.Close();
10        msIn.Close();
11        msOut.Position = 0;
12        StreamReader sr = new StreamReader(msOut);
13        String xmlStr = String.Format("{0}", sr.ReadToEnd());
14        msOut.Close();
15        sr.Close();
16        return xmlStr;

可以不用复杂的服务端NavBar的实现了，简单动态的导航组件就实现了，简易的状态还是可以维护的，
复杂的应用场景可能得令作些工作了.