spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / authoring / languages / xhtml / beginning / chap13 / 4 To page 1To page 2current pageTo page 4
[previous] [next]

Beginning XHTML

Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?

Try It Out - Using XSL Transformations

In this exercise, you are going to get a taste of things to come. Specifically, you are going to use the World Wide Web's new XSL Transformation technology to convert an XML document into two different presentations.

  1. Run your text editor and type in the following:
    <?xml version="1.0"?>
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
     <xsl:template match="/">
       <html>
        <head>
          <title>Film Library:<xsl:value-of select="filmlibrary/name"/></title>
        </head>
        <body>
          <table border="2">
           <tr>
             <td>Title</td>
             <td>Director</td>
             <td>Year</td>
             <td>Genre</td>
           </tr>
           <xsl:for-each select="filmlibrary/movie">
             <tr>
              <td><xsl:value-of select="title"/></td>
              <td><xsl:value-of select="credits/director"/></td>
              <td><xsl:value-of select="year"/></td>
              <td><xsl:value-of select="genre"/></td>
             </tr>
           </xsl:for-each>
          </table>
        </body>
       </html>
     </xsl:template>
    </xsl:stylesheet>
  2. Save the file as movie1.xsl.
  3. Create a new document in your text editor and type in the following:
    <?xml version="1.0"?>
    <?xml-stylesheet type="text/xsl" href="movie1.xsl"?>
    <filmlibrary>
     <name>Classic Films</name>
     <movie>
       <title>Beauty and the Beast</title>
       <genre>Fantasy</genre>
       <country>France</country>
       <language>French</language>
       <year>1946</year>
       <length>90 Min.</length>
       <filmtype>BW</filmtype>
       <credits>
        <director>Jean Cocteau</director>
        <producer>Andre Paulve</producer>
        <writer>Jean Cocteau</writer>
        <story>Mme Leprince de Beaumont</story>
        <cinematography>Henri Alekan</cinematography>
       </credits>
       <plot>Beauty lives in a cottage with her father and
       her two wicked sisters. Once day her father comes
       upon a strange mansion with an ugly sorcerer named
       Beast.
       </plot>
     </movie>
     <movie>
       <title>The Bicycle Thief</title>
       <genre>Social Drama</genre>
       <country>Italy</country>
       <language>Italian</language>
       <year>1948</year>
       <length>90 Min.</length>
       <filmtype>BW</filmtype>
       <credits>
        <director>Vittorio de Sica</director>
        <producer>Vittorio de Sica</producer>
        <writer>Vittorio de Sica</writer>
        <story>Gennarino Bartolini</story>
        <cinematography>Carlo Montuori</cinematography>
       </credits>
       <plot>Told through the eyes of a young boy 
        named Bruno, <title>The Bicycle Thief</title> is the
        story of his father"s struggle to provide for his family
        in Rome following World War II.
       </plot>
     </movie>
    </filmlibrary>
  4. Save the file as movie1.xml. Run the file in Microsoft Internet Explorer. You should see something like this:
    1
  5. Run your text editor and type in the following:
    <?xml version="1.0"?>
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
     <xsl:template match="/">
       <html>
        <head>
          <title>Film Library:<xsl:value-of select="filmlibrary/name"/></title>
        </head>
        <body>
          <xsl:for-each select="filmlibrary/movie">
           <h1 style="text-align: center">
             <xsl:value-of select="title"/>
           </h1>
           <h2 style="text-align: center">
             <xsl:value-of select="year"/> 
             <xsl:value-of select="credits/director"/>
           </h2>
           <p>
             <xsl:value-of select="genre"/>.<xsl:value-of select="plot"/>
           </p>
          </xsl:for-each>
        </body>
       </html>
     </xsl:template>
    </xsl:stylesheet>
  6. Save the file as movie2.xsl.
  7. Load the movie1.xml file into your text editor and make href point to the second version of the XSL style sheet:
    
    <?xml-stylesheet type="text/xsl" href="movie2.xsl"?>
  8. Save the file as movie2.xml. Run the file in Microsoft Internet Explorer. You should see something like this:
    2
home / authoring / languages / xhtml / beginning / chap13 / 4 To page 1To page 2current pageTo page 4
[previous] [next]

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business


Created: May 04, 2001
Revised: May 04, 2001


URL: http://webreference.com/authoring/languages/xhtml/chap13/4/