导航组件实现：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的实现了，简单动态的导航组件就实现了，简易的状态还是可以维护的，
复杂的应用场景可能得令作些工作了.