作者：未知 来源：月光软件站 加入时间：2005-2-28　月光软件站

Zee注：虽然不是很复杂，也算是个XML的应用吧。  ：）

Bryn Waibel 和 John Boylan
2000年7月10日
MSDN Library 是 MSDN 的信息中心库，包括超过 250，000 个文件，目录 (TOC) 是此类数据的主要访问点。
但是 MSDN 库中的 TOC 工作并不尽如人意，因此需要废弃和替换 — 越快越好。
包括 Bryn Waibel 和 Mike Barta 在内的 MSDN Web 设计小组，被委托创建新的 TOC。
所幸的是，解决方案非常直接：新的 TOC 使用 JavaScript 将 XML 作为数据层加以覆盖。
我们将在本文中向您展示如何完成这项工作，并包括一个可以作为设计模板的 TOC 示例。

我们希望 TOC 能够提供跨平台访问，改善的可维护性以及全球化所需的扩展字符集。

实际情况

弄清实际情况

• XML 结构  我们知道需要一个 XML 数据层。不管考虑何种解决方案，答案总是最终归结到 XML。
  
• 数据分块  数据必须分成足够小的块，以便任何连接情况下都可以发送给客户机。Windows 2000 小组试图在将 Windows 2000 帮助文件置为联机时遇到了相似的问题，
  因此他们的代码显然只是一个开端。
  
• 与一个节点同步  TOC 中的每个节点必须可被发现，它只知道它所指向的 .htm 页。此数据必须可更新，并独立于 TOC 中不相关的更改。
  
• 划分供应商  MSDN Library 的数据来源于成百上千的供应商，包括多种格式：.rtf、.chm、.htm 等等。需要一种方式将它们都映像在一起并保持各自的独立性。
  
• 重用性  数据需要可重复使用。我们不希望在不同视图中显示同一个数据时不得不重新编辑 TOC 的某个部分。

生成目录

TOC XML 结构

Library 属性

• nodeType 属性有三个可能的值：
  • 节点   此节点有子节点，子节点出现在此文件中。
  • 页   这是一个终端节点；它没有子节点。
  • 集合   此节点有子节点，但它们位于不同的文件中。
  
  
• prePartum 属性引用一个可以在其中找到子节点的文件。此属性值是某个通向特定文件的路径，此文件在其根目录下含有指向它的节点的精确备份 — 除非其的 nodeType 值是 “node”，并且其子节点存在。对 XML Document Object Model (DOM) 来说，执行的操作是：通过 prePartum 装入所指向的文件并用该文件的顶部节点代替当前节点。
  
• tocPath 属性包含 TOC 中给定节点零索引路径。每个节点索引通过虚线与其它索引分开，以便能从字符串表中容易地提取并直接插入到 XML DOM 中。TOC 中第一个节点的 tocPath 值为 0，第二个子节点的 tocPath 值为 0-1 依此类推 — 从而形成一个到 TOC 的顶端任何节点的直接路径。我们还给 tocPath 值的起始处添加了一个标记，以表明路径相关的区域。在 Library 的顶端，此标记是“lib”。我们将在以后讲到如何维护每个目录供应商的独立性时进一步讨论这一问题。
  
• state 属性是显示驱动的属性；如果没有状态，节点将以其默认状态处理。节点可以有两个状态：
  
  
  • sel 这是节点在树中的当前节点。如果节点指向目录；将以粗体显示；如果 nodeType="node"，节点将显示为打开状态。
  • open 此状态表明节点位于当前节点的路径中。只有 nodeType="node"的节点才能有此属性。
  
  
• ref 属性包含指向相关节点所引用数据的路径。在 Library 中，这一路径是指向 .htm 或 .asp 文件的 URL。
  
• title 属性包含当前节点的显示名。

数据分块

与一个节点同步

<!DOCTYPE MsdnTocMap [<!ELEMENT MsdnTocMap (L+)>

<!ATTLIST MsdnTocMap rootToc CDATA #IMPLIED>

<!ELEMENT L EMPTY>

<!ATTLIST L  url ID #REQUIRED  pth CDATA #REQUIRED>]>

function FormatFileName( sFileName )

{

    if( "string" == typeof( sFileName ) )  

    {// 删除非字母字符、句号、虚线、下划线或括号（ID 属性是必需的）之外的所有字符  

        sFileName = sFileName.replace( /[^\w\.-_:]/gi , "" );

        // 不能以数字开头  

       if ( sFileName.match( /^[\.\d]/i ) ) sFileName = "f" + sFileName;

       return sFileName;  }}

划分供应商

应用程序示例

msdnce.xml

<MsdnToc>

<MTN title="MSDN Code Examples" nodeType="node" type="none" 

   tocPath="msdnce-0" hal="en-us">

<MTN title="The MSDN TOC" nodeType="collection" type="none" 

   tocPath="ltoc0" hal="en-us" prePartum="ltoc0.xml"/>

</MTN>

</MsdnToc>
msdnce.xml 文件非常简单；它只是控制所有 MSDN 代码示例的一个节点。

这种控制包括一个指向我们的示例 Ltoc0.xml 的单个集合节点。 

ltoc.xml

<MTN title="The MSDN TOC" nodeType="node" type="none" tocPath="ltoc0" hal="en-us">

   <MTN title="Revamping MSDN TOC" nodeType="leaf" type="file" 

	ref="library.asp"?tocPath="ltoc0-0"/>

   <MTN title="ASP Fles" nodeType="node" type="none"?tocPath="ltoc0-1">

      <MTN title="loadtree.asp" nodeType="leaf" type="file" 

	ref="loadtree.asp.txt"?tocPath="ltoc0-1-0" />

      <MTN title="toc.asp" nodeType="leaf" type="file" 

		ref="toc.asp.txt"?tocPath="ltoc0-1-1" />

      <MTN title="default.asp" nodeType="leaf" type="file" 

	ref="default.asp.txt"?tocPath="ltoc0-1-2" />

   </MTN>

   <MTN title="CSS Files" nodeType="node" type="none"?tocPath="ltoc0-2" >

      <MTN title="toc.css" nodeType="leaf" type="file" 

	ref="toc.css.txt"?tocPath="ltoc0-2-0" />

   </MTN>

   <MTN title="JS Files" nodeType="node" type="none"?tocPath="ltoc0-3" >

      <MTN title="toc.js" nodeType="leaf" type="file" 

	ref="toc.js.txt"?tocPath="ltoc0-3-0" />

   </MTN>

   <MTN title="Include Files" nodeType="node" type="none"?tocPath="ltoc0-4" >

      <MTN title="locals.inc" nodeType="leaf" type="file" 

	ref="locals.inc"?tocPath="ltoc0-4-0" />

   </MTN>

   <MTN title="XML Files" nodeType="node" type="none"?tocPath="ltoc0-5" >

     <MTN title="msdnce.xml" nodeType="leaf" type="file" 

	ref="msdnce.xml"?tocPath="ltoc0-5-0" />

     <MTN title="ltoc0.xml" nodeType="leaf" type="file" 

	ref="ltoc0.xml"?tocPath="ltoc0-5-1" />

     <MTN title="map.xml" nodeType="leaf" type="file" 

	ref="map.xml"?tocPath="ltoc0-5-2" />

     <MTN title="submap.xml" nodeType="leaf" type="file" 

	ref="submap.xml"?tocPath="ltoc0-5-3" />

  </MTN>

  <MTN title="XSL Files" nodeType="node" type="none"?tocPath="ltoc0-6" >

     <MTN title="toc.xsl" nodeType="leaf" type="file" 

	ref="tocdown.xsl"?tocPath="ltoc0-6-0" />

  </MTN>

  <MTN title="Graphics Files" nodeType="node" type="none"?tocPath="ltoc0-7" >

     <MTN title="bo.gif" nodeType="leaf" type="file" ref="bo.gif"?tocPath="ltoc0-7-0" />

     <MTN title="bs.gif" nodeType="leaf" type="file" ref="bs.gif"?tocPath="ltoc0-7-1" />

     <MTN title="dc.gif" nodeType="leaf" type="file" ref="dc.gif"?tocPath="ltoc0-7-2" />

  </MTN>

</MTN>

map.xml

<?xml version="1.0"?>

<!DOCTYPE MsdnTocMap [<!ELEMENT MsdnTocMap (L+)>

<!ATTLIST MsdnTocMaprootToc CDATA #IMPLIED>

<!ELEMENT L EMPTY>

<!ATTLIST Lurl ID #REQUIREDpth CDATA #REQUIRED>]>

<MsdnTocMap>

<L url="library.asp"?pth="ltoc0-0"/>

<L url="loadtree.asp.txt"?pth="ltoc0-1-0" />

<L url="toc.asp.txt"?pth="ltoc0-1-1" />

<L url="default.asp.txt"?pth="ltoc0-1-2" />

<L url="toc.css.txt"?pth="ltoc0-2-0" />

<L url="toc.js.txt"?pth="ltoc0-3-0" />

<L url="locals.inc"?pth="ltoc0-4-0" />

<L url="msdnce.xml"?pth="ltoc0-5-0" />

<L url="ltoc0.xml"?pth="ltoc0-5-1" />

<L url="map.xml"?pth="ltoc0-5-2" />

<L url="submap.xml"?pth="ltoc0-5-3" />

<L url="tocdown.xsl"?pth="ltoc0-6-0" />

<L url="bo.gif"?pth="ltoc0-7-0" />

<L url="bs.gif"?pth="ltoc0-7-1" />

<L url="dc.gif"?pth="ltoc0-7-2" />

</MsdnTocMap>

submap.xml

<?xml version="1.0"?>

<!DOCTYPE MsdnTocMap [<!ELEMENT MsdnTocMap (L+)>

<!ATTLIST MsdnTocMaprootToc CDATA #IMPLIED>

<!ELEMENT L EMPTY>

<!ATTLIST Lurl ID #REQUIREDpth CDATA #REQUIRED>]>

<MsdnTocMap>

<L url="ltoc0"?pth="msdnce-0-0" />

</MsdnTocMap>

locals.inc

<%//  default.asp 的标题var L_HomePageTitle_HTMLText= "MSDN TOC Code Example";

// 文本方向设置（从右到左是 RTL）

var L_strBiDiMode_HTMLText = "LTR";

// 正在装入消息文本

var L_LoadingMsg_HTMLText = "Loading, click to cancel... ";

// 源信息

var RootDir = "msdnce.xml";

var DefaultTopic = "library.asp";

var SubMapPath = "subMap.xml";

var RootTocToken = "msdnce";%>

ASP

loadtree.asp

toc.asp

XSL

<xsl:template match="MTN[@nodeType='node']">

<!-- HTML for node -->

<xsl:apply-templates select="MTN"/>

</xsl:template> 

<xsl:template match="MTN[@nodeType='collection']">

<!-- HTML for collection --></xsl:template>

<xsl:template match="MTN[@nodeType='leaf']">

<!-- HTML for leaf --></xsl:template>

JavaScript 和 CSS

从这里取走

相关软件：