Table 的内容 XSL

Question

问题：我正在做一个 table 的内容，包括章节、小节、小节和子小节。我想要的是用xsl处理信息（在XML中），转换成一个HTML页面。

XML:

<chapter id="c1">
        <title>Chapter 1</title>
        <section id="s1.1">
            <title>Motivation</title>
                 (...)

        <section id= "s1.2">
                 (...)
 <chapter id="c2">

        <title>Chapter 2 </title>
        <section id="s2.1">
             <title> Genetics </title>
                 <subsection id="ss2.1.1">
                      <title> Brief History </title> 
                     (...)

XSL:

<xsl:template match="toc">
        <h3>Table of contents</h3>
        <ul> 
            <xsl:apply-templates mode="indice" select="//chapter">
            <xsl:sort/>
            </xsl:apply-templates>
        </ul>
</xsl:template>


<xsl:template mode="indice" match="chapter">      
    <h3> 
            <xsl:value-of select="title"/>
    </h3>

    <ol>
        <xsl:for-each select="section">               
            <li>
                <a href="#{@id}"> 
                    <xsl:value-of select="title"/>
                </a>  
                <ol>
                <xsl:for-each select="subsection">                      
                        <li>
                            <a href="#{@id}"> 
                                <xsl:value-of select="title"/>
                            </a>
                            <ol>
                                <xsl:for-each select="subsubsection">                      
                                    <li>
                                        <a href="#{@id}"> 
                                            <xsl:value-of select="title"/>
                                        </a>
                                    </li>
                                </xsl:for-each> 
                            </ol>
                        </li>                                               
                </xsl:for-each> 
                </ol>
            </li>               
        </xsl:for-each>
    </ol>
</xsl:template>

我使用以下 CSS 样式在有序列表中创建子列表：

<style>
     body{
        text-align: justify;
     }
     ol {counter-reset: item}
     li {display: block}
     li:before {content: counters(item, ".") ". "; counter-increment: item}
</style>

HTML中的当前结果：

 Chapter 1
       1. Motivation
       2. Objectives
       3. Thesis structure

 Chapter 2
       1. Genetics
          1.1. Brief History
          1.2. Topics
       2. Genes: study
          2.1. Eucariots
          2.2. Procaritots
       3. Stuff
          3.1. stuff
          3.2. stuff
                 3.2.1. stuff
                 3.2.2. stuff
          (...)

HTML 中的预期结果：

 Chapter 1
       1.1. Motivation
       1.2. Objectives
       1.3. Thesis structure

 Chapter 2
       2.1. Genetics
          2.1.1 Brief History
          2.1.2 Topics
       2.2. Genes: study
          2.2.1. Eucariots
          2.2.2. Procaritots
       2.3. Stuff
          2.3.1. stuff
          2.3.2. stuff
                 2.3.2.1. stuff
                 2.3.2.2. stuff
          (...)

有什么建议吗？

Answer 1

计数是否必须在 CSS 内进行？如果没有，您可以将 <xsl:number> 与这样的东西一起使用：

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:template match="text()"/>
    <xsl:template match="text()" mode="indice"/>
    <xsl:template match="toc">
        <html>
            <body>
                <h3>Table of contents</h3>
                <ul>
                    <xsl:apply-templates mode="indice" select="//chapter">
                        <xsl:sort/>
                    </xsl:apply-templates>
                </ul>
            </body>
        </html>
    </xsl:template>
    <xsl:template match="chapter" mode="indice">
        <h3>
            <xsl:value-of select="title"/>
        </h3>
        <ul>
            <xsl:apply-templates mode="indice"/>
        </ul>
    </xsl:template>
    <xsl:template match="section" mode="indice">
        <li>
            <xsl:attribute name="data-value">
                <xsl:number count="chapter"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="section"/>
                <xsl:text>.</xsl:text>
            </xsl:attribute>
            <a href="#{@id}">
                <xsl:value-of select="title"/>
            </a>
            <xsl:if test="subsection">
                <ul>
                    <xsl:apply-templates mode="indice"/>
                </ul>
            </xsl:if>
        </li>
    </xsl:template>
    <xsl:template match="subsection" mode="indice">
        <li>
            <xsl:attribute name="data-value">
                <xsl:number count="chapter"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="section"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="subsection"/>
                <xsl:text>.</xsl:text>
            </xsl:attribute>
            <a href="#{@id}">
                <xsl:value-of select="title"/>
            </a>
            <xsl:if test="subsubsection">
                <ul>
                    <xsl:apply-templates mode="indice"/>
                </ul>
            </xsl:if>
        </li>
    </xsl:template>
    <xsl:template match="subsubsection" mode="indice">
        <li>
            <xsl:attribute name="data-value">
                <xsl:number count="chapter"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="section"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="subsection"/>
                <xsl:text>.</xsl:text>
                <xsl:number count="subsubsection"/>
                <xsl:text>.</xsl:text>
            </xsl:attribute>
            <a href="#{@id}">
                <xsl:value-of select="title"/>
            </a>
        </li>
    </xsl:template>
</xsl:stylesheet>

（并且可能重构属性 data-value 的生成）然后像这样使用一些 CSS：

li:before {
            content:attr(data-value);
        }

如果您的 @id 始终包含正确的数字，您只需将 @id 中的 s 替换 (translate) 为 "nothing" 并显示使用 CSS 伪元素...

Answer 2

如果您要求编号出现在 CSS 中，您可以执行以下操作。使用以下 XSL：

<xsl:template match="toc">
      <h3>Table of contents</h3>
      <ul>
          <xsl:apply-templates mode="indice" select="//chapter"/>
      </ul>
</xsl:template>


<xsl:template mode="indice" match="chapter">
  <!-- Add a class on the list items related to a chapter -->
  <li class="chapter"> 
    <xsl:value-of select="title"/>
    <ol>
        <xsl:for-each select="section">               
            <li>
                <a href="#{@id}">
                  <xsl:value-of select="title"/>
                </a>
                <xsl:if test="subsection">
                  <ol>
                    <xsl:for-each select="subsection">
                      <li>
                          <a href="#{@id}"> 
                              <xsl:value-of select="title"/>
                          </a>
                          <xsl:if test="subsubsection">
                            <ol>
                              <xsl:for-each select="subsubsection">                      
                                <li>
                                  <a href="#{@id}"> 
                                      <xsl:value-of select="title"/>
                                   </a>
                                </li>
                              </xsl:for-each> 
                          </ol>
                        </xsl:if>
                      </li>                                               
                    </xsl:for-each> 
                  </ol>
                </xsl:if>
            </li>               
        </xsl:for-each>
    </ol>
  </li>
</xsl:template>

和以下 CSS：

   body {
      text-align: justify;
   }
   ol, ul {
    counter-reset: item;
   }
   li {
    display: list-item;
    list-style-type: none;
   }
   li.chapter::before {
    content: "";
   }
   li:before {
    content: counters(item, ".") ". ";
    counter-increment: item
   }

结果如你所愿

Table 的内容 XSL

Table of contents XSL

html

css

xml

xslt