Vyčištění HTML kódu tabulky pomocí XSLT

Pachollini, 5. června 2004, 14:55

Jak vyčistit HTML kód?

Pavel Růžička se na Intervalu.cz v článku „ Vyčištění tabulky z MS Wordu v MSIE JavaScriptem“ zabývá častým problémem webdesignérů: jak z dodaných podkladů, v tomto případě wordovské či excelovské tabulky, dostat přebytečný balast. Jeho řešení, založené na JavaScriptu, sestává z cca. 150ti řádků HTML a JS kódu. Takový postup má dvě velké nevýhody: jednak je zbytečně komplikovaný a jednak funguje jen v Internet Exploreru pod Windows. Z komentářů k článku se navíc zdá, že i tam jen někdy.

Dobrých řešení jistě existuje spousta, mmě osobně se osvědčilo následující. Pokud potřebuji dostat z dodaných podkladů tabulku, aniž bych musel znovu formátovat všechna data, používám krátkou XSLT šablonu, která z HTML vypustí všechny atributy a všechny elementy s výjimkou definovaných. V mém případě se jedná o elementy <table>, <tbody>, <thead>, <tr>, <th> a <td>, ale lze je samozřejmě upravit podle aktuálních potřeb. Někdy může být výhodné vypustit element <tbody>, neboť např. OpenOffice.org ho velmi nadužívá (někdy do něj uzavírá každý řádek). Řozšířením množiny použitých elementů lze naopak šablonu upravit tak, aby se dala použít pro vyčištění jakéhokoliv HTML kódu a nikoliv jen tabulek.

Řešení pomocí XSLT transformace má samozřejmě zásadní nevýhodu: HTML kód, který takto čistím musí být dobře strukturovaný (well formed) XML dokument, což pro výstup z kancelářských dokumentů vesměs neplatí a kdyby platilo, bylo by čištění téměř zbytečné. (Ale jenom téměř, protože i dobře strukturované XHTML může obsahovat spoustu nežádoucích elementů a atributů.) Před samotnou XSLT transformací je tedy ještě třeba upravit původní kód. Pro tento účel používám PSPad obsahující knihovnu HTML Tidy, která umí převést libovolné HTML na XHTML, tedy na dobře strukturované XML. Samotnou transformaci provádím ve výborném freeware XML/XSLT editoru XML Cooktop, který zavolá XSLT procesor a rovnou zobrazí výsledek.

Pokud si po přečtění těchto řádků připadáte jako ve španělské vesnici, asi už chápete i druhou nevýhodu mého postupu: vyžaduje znalost XSLT transformací nebo přinejmenším znalost použití XSLT procesoru a obeznámenost s XML. Avšak vzhledem k tomu, že XSLT je dle mého názoru vynikající technologie a dnes už si nedovedu představit, že bych se bez ní obešel při tvorbě byť sebejednodužšího webu, ztrácí tato nevýhoda dost ze své váhy. XSLT se IMHO při tvorbě webu navíc hodí podstatně více než znalost proprietárních Microsoftích „vymožeností“. Nováčkům v této oblasti doporučuji odkazy na konci tohoto článku.

Shrnutí postupu:

  1. vyexportujeme tabulku z Wordu či Excelu do HTML
  2. takto získaný soubor zkrášlíme TIDYm, abychom získali XML
  3. získané XML proženeme XSLT transformací
  4. ušetřený čas trávíme zalíbeným prohlížením čistého kódu

XSLT kód pro transformaci

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

  <xsl:output omit-xml-declaration="yes" method="xml"/>
  <xsl:strip-space elements="td"/>

  <xsl:template match="/">
      <xsl:apply-templates select="//table"/>
  </xsl:template>

  <xsl:template match="table">
    <table>
      <xsl:apply-templates select="*"/>
    </table>
  </xsl:template>

  <xsl:template match="tbody | thead ">
    <xsl:element name="{local-name()}">
      <xsl:apply-templates select="descendant::tr"/>
    </xsl:element>
  </xsl:template>

  <xsl:template match="tr">
    <tr>
      <xsl:apply-templates 
        select="descendant::td | descendant::th"/>
    </tr>
  </xsl:template>

  <xsl:template match="td | th">
    <xsl:copy>
        <xsl:apply-templates select="descendant::text()"/>
      </xsl:copy>
  </xsl:template>

</xsl:stylesheet>

Zdroje o XML a XSLT

Aneb pár odkazů, o kterých si myslím, že budou nováčkům k užitku.

V češtině:

V angličtině:

Co vy na to?

zobrazit všechny komentáře

Aktuální Seky

.