Question

我开始使用XSL和XML进行开发以派生HTML。我正在为此获得一个有效的XSLT模板。

我很难尝试将正确的XSL应用于代表网站菜单的结构化XML数据结构。

结果应类似于： enter image description here

我作为数据源的XML是：

<?xml version="1.0" encoding="utf-8" ?>
<SMARTSMenu>
    <Menu Type="Home" Caption="Home"></Menu>
    <Menu Type="BankingFulfillment" Caption="Initiate Request"></Menu>
    <Menu Type="Drafts" Caption="Drafts"></Menu>
    <Menu Type="SearchManageCase" Caption="Search Requests"></Menu>
    <Menu Type="PendingApproval" Caption="Pending Approval"></Menu>
    <Menu Type="MyWorkQueue" Caption="My Work Queue"></Menu>
    <Menu Type="ManagementTools" Caption="Management Tools"></Menu>
    <Menu Type="Administration" Caption="Administration">

        <Menu Type="Administration" Caption="General Administration"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="Maintain Wire Reference"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="Maintain Associate Information"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="Maintain Reason for Claim"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="Maintain Request Information"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="Unlock Request"></Menu>
            <Menu URL="page1.html" Type="Administration" Caption="AuditReport"></Menu>
        </Menu>

        <Menu Type="Administration" Caption="Maintain Email">
            <Menu URL="page2.html" Type="Administration" Caption="Maintain Email Template"></Menu>
            <Menu URL="page2.html" Type="Administration" Caption="Maintain Template to Request Association"></Menu>
        </Menu>

        <Menu Type="Administration" Caption="SR Remedy">
            <Menu URL="page3.html" Type="Administration" Caption="Remedy SR"></Menu>
            <Menu URL="page3.html" Type="Administration" Caption="Move SR to Letter Queue"></Menu>
        </Menu>
</SMARTSMenu>

我正在尝试生成基于XSLT的HTML：

<div class="maiNav meganav">
    <nav>
        <ul class="maiNav-nav horizontal">
            <li id="navHome"><a href="#">Home</a></li>
            <li id="navInitiate" class="dropdown meganav-fullwidth actve"><a class="dropdown-toggle" href="#" data-toggle="dropdown">Initiate Request</a></li>
            <li id="navDrafts"><a href="#">Drafts</a></li>
            <li id="navSearch"><a href="#">Search Requests</a></li>
            <li id="navPending" class="disabled"><a href="#">Pending Approval</a></li>
            <li id="navTools"><a href="#">Management Tools</a></li>
            <li id="navAdmin" class="last dropdown meganav-fullwidth"><a class="dropdown-toggle" href="#" data-toggle="dropdown">Administration<b class="caret"></b></a>
                <ul class="dropdown-menu temp">
                    <li>
                        <div class="meganav-content">
                            <div class="row">
                                <div class="grid-12">
                                    <h3 class="dropdown-header">General Administration</h3>
                                    <ul>
                                        <li><a href="#">Maintain Wire Reference</a></li>
                                        <li><a href="#">Maintain Associate Information</a></li>
                                        <li><a href="#">Maintain Reason for Claim</a></li>
                                        <li><a href="#">Maintain Request Information</a></li>
                                        <li><a href="#">Unlock Request</a></li>
                                        <li><a href="#">AuditReport</a></li>
                                    </ul>
                                </div>
                                <div class="grid-12">
                                    <h3 class="dropdown-header">Maintain Email</h3>
                                    <ul>
                                        <li><a href="#">Maintain Email Template</a></li>
                                        <li><a href="#">Maintain Template to Request Association</a></li>
                                    </ul>
                                </div>
                                <div class="grid-12">
                                    <h3 class="dropdown-header">SR Remedy</h3>
                                    <ul>
                                        <li><a href="#">Remedy SR</a></li>
                                        <li><a href="#">Move SR to Letter Queue</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>
</div>

我的XSLT看起来像这样（正在进行中）：

<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">


<html>
<head>
    <title></title>
</head>

<body>


<div class="maiNav meganav">
    <nav>
        <ul class="maiNav-nav horizontal">
            <li id="navHome"><a href="#"><xsl:value-of select="SMARTSMenu/Menu[1]/@Caption" /></a></li>
            <li id="navInitiate" class="dropdown meganav-fullwidth actve"><a class="dropdown-toggle" href="#" data-toggle="dropdown"><xsl:value-of select="SMARTSMenu/Menu[2]/@Caption" /></a></li>
            <li id="navDrafts"><a href="#"><xsl:value-of select="SMARTSMenu/Menu[3]/@Caption" /></a></li>
            <li id="navSearch"><a href="#"><xsl:value-of select="SMARTSMenu/Menu[4]/@Caption" /></a></li>
            <li id="navPending" class="disabled"><a href="#"><xsl:value-of select="SMARTSMenu/Menu[5]/@Caption" /></a></li>
            <li id="navTools"><a href="#"><xsl:value-of select="SMARTSMenu/Menu[6]/@Caption" /></a></li>
            <li id="navAdmin" class="last dropdown meganav-fullwidth"><a class="dropdown-toggle" href="#" data-toggle="dropdown"><xsl:value-of select="SMARTSMenu/Menu[7]/@Caption" /><b class="caret"></b></a>
                <ul class="dropdown-menu temp">
                    <li>
                        <div class="meganav-content">
                            <div class="row">
                                <div class="grid-12">
                                    <h3 class="dropdown-header">General Administration</h3>
                                    <ul>
                                        <xsl:for-each select="//Menu/@Administration">
                            <ul class="maiNav-nav horizontal">
                                <li id="navHome">ff <a href="#">vv<xsl:value-of select="/Menu/@Caption"/></a></li>       
                        </ul>
                        </xsl:for-each>



                                    </ul>
                                </div>
                                <div class="grid-12">
                                    <h3 class="dropdown-header">Maintain Email</h3>
                                    <ul>
                                        <li><a href="#">Maintain Email Template</a></li>
                                        <li><a href="#">Maintain Template to Request Association</a></li>
                                    </ul>
                                </div>
                                <div class="grid-12">
                                    <h3 class="dropdown-header">SR Remedy</h3>
                                    <ul>
                                        <li><a href="#">Remedy SR</a></li>
                                        <li><a href="#">Move SR to Letter Queue</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>
</div>

</body>
</html>
</xsl:template>
</xsl:stylesheet>

Answer 1

以下XSLT应该为您提供所需的几乎所有内容。有三个问题：

您的输入XML似乎有一个错误：行
```
<Menu Type="Administration" Caption="General Administration"></Menu>
```
不应该在行尾但在文件的最末端有结束标记。
无法从XML文件派生锚名称。
某些类（例如disabled）无法从XML文件派生。

我假设您必须在输入XML文件中添加一些信息。

XSLT：

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet 
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes" />

  <xsl:template match="SMARTSMenu">
    <div class="maiNav meganav">
      <nav>
        <ul class="maiNav-nav horizontal">

          <!-- top layer -->
          <xsl:for-each select="Menu">
            <li id="nav{@Caption}">
              <a href="#"><xsl:value-of select="@Caption"/></a>
              <xsl:if test="Menu">
                <ul class="dropdown-menu temp">

                  <!-- second layer -->
                  <xsl:for-each select="Menu">
                    <li>
                      <div class="meganav-content">
                        <div class="row">
                          <div class="grid-12">
                            <h3 class="dropdown-header"><xsl:value-of select="@Caption"/></h3>
                            <xsl:if test="Menu">
                              <ul>

                                <!-- third layer -->
                                <xsl:for-each select="Menu">
                                  <li><a href="#"><xsl:value-of select="@Caption"/></a></li>
                                </xsl:for-each>
                              </ul>
                            </xsl:if>
                          </div>
                        </div>
                      </div>
                    </li>
                  </xsl:for-each>
                </ul>
              </xsl:if>
            </li>
          </xsl:for-each>
        </ul>
      </nav>
    </div>
  </xsl:template>
</xsl:stylesheet>

可以通过xml和xsl循环遍历xml节点来制作菜单吗？

1 个答案: