ループスルーテーブル

Question

私はテーブルごとにループし、個々のdivに変換しようとしています。 tr [1]/td [1]、tr [2]/td [1]、tr [3]/td [1] ...がすべて1つのdivの一部であるようにしたい。次に、tr [1]/td [2]、tr [2]/td [2]、tr [3]/td [2]に移りたいと思います。

私は単純なコードを使用すると私のテーブルを変換することができますが、各tr行を下にジャンプする問題があります。以下は私のXSLTです。どんな助けも素晴らしいだろう。私はXSLTの新機能ですが、プログラミングはしていません。 divs/stylingは単に出力を見やすくすることです。

XML：

<table class="table-with-caption"> 
    <thead> 
    <tr> 
     <th>Column Title 1</th> 
     <th>Column Title 2</th> 
     <th>Column Title 3</th> 
     <th>Column Title 4</th> 
    </tr> 
    </thead> 
    <tfoot> 
    <tr> 
     <td class="alert-info table-scroll-option" colspan="4">column</td> 
    </tr> 
    </tfoot> 
    <tbody> 
    <tr> 
     <td>TR1, TD1</td> 
     <td><span>TR1, TD2</span></td> 
     <td><span>TR1, TD3</span></td> 
     <td><span>TR1, TD4</span></td> 
    </tr> 
    <tr> 
    <td><span>TR2, TD1</span></td> 
    <td>Atque ab corporis modi deserunt adipisci, expedita temporibus.</td> 
    <td>Vitae, sint ullam velit accusantium, dolorum ad dolorem.</td> 
    <td>Iusto expedita minus praesentium vero voluptatum aut laboriosam.</td> 
    </tr> 
    <tr> 
    <td><span>TR3, TD1</span>.</td> 
    <td>Consequuntur corporis quo libero fuga ducimus provident minus.</td> 
    <td>Natus reiciendis molestias earum, dolorum similique amet quasi.</td> 
    <td>Consequuntur sunt minus laudantium, magnam labore, debitis quia!</td> 
    </tr> 
    </tbody> 
</table> 

XSL：

<xsl:for-each select="tbody/tr[position()&lt;=$count-rows]"> 
     <xsl:variable select="1" name="counter" /> 
     <div style="border:thin solid red; padding 5px; margin:5px;"> 
     <xsl:for-each select="tr[$counter]/td[position() le $count-cols]"> 
      <div style="border:thin solid blue; padding 5px; margin:5px;"> 
      <xsl:apply-templates select="node()[name() != 'caption']|attribute()[name() != 'class' and name() != 'tfoot']" /> 
      </div> 
      <xsl:with-param name="counter" select="$counter + 1"/> 
     </xsl:for-each> 

     </div> 
    </xsl:for-each> 
    </div> 
</xsl:when> 

予想される出力：

<div style="border:thin solid red; padding 5px; margin:5px;"> 
    <div style="border:thin solid blue; padding 5px; margin:5px;">TR1, TD1</div> 
    <div style="border:thin solid blue; padding 5px; margin:5px;"><span>TR2, TD1</span></div> 
    <div style="border:thin solid blue; padding 5px; margin:5px;"><span>TR3, TD1</span></div> 
</div> 

Answer 1

リソース@ michael.hor257kを使用して、自分のコードを把握することができました。ここに私が思い付いたものです：

div要素にテーブルを変換し、次の出力を生成

<xsl:when test="tfoot/tr/td = 'column'"> 
    <div class="grid "> 
    <xsl:variable name="row" select="tbody/tr"/> 
    <xsl:variable name="col" select="tbody/tr[1]/td"/> 

    <xsl:for-each select="$col">  
     <xsl:variable name="i" select="position()" /> 
      <div class="grid_item" style="border:thin solid red; padding 5px; margin:5px;"> 
       <xsl:for-each select="$row"> 
        <div style="border:thin solid blue; padding 5px; margin:5px;"> 
         <xsl:value-of select="td[$i]"/><br/><br/> 
        </div> 
       </xsl:for-each> 
      </div> 
      <xsl:variable name="i" select="$i+1" /> 
     </xsl:for-each> 
    </div> 
</xsl:when> 

：Div Output