1 / 20

XSL

XSL . eXtensible Stylesheet Language. What is XSL?. XSL is a language that allows one to describe a browser how to process an XML file. XSL can convert an XML file into another XML with different format. XSL can convert an XML file into a non-XML file. XSL.

studs
Download Presentation

XSL

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. XSL eXtensibleStylesheet Language

  2. What is XSL? • XSL is a language that allows one to describe a browser how to process an XML file. • XSL can convert an XML file into another XML with different format. • XSL can convert an XML file into a non-XML file.

  3. XSL • The most common type of XSL processing is to convert XML file into HTML file which can be displayed by browsers. We will focus on this use of XSL. • XSL is the bridge between XML and HTML. • We can use XSL to have different HTML formats for the same data represented in XML. • Separating data (contents) from style tags (display commands). • XML example, class.xml

  4. XML Tree (Logical Structure)

  5. XSL Example for class.xml (XMLHTML) <?xml version=“1.0” ?> <xsl:stylesheetxmlns:xsl=“http://www.w3.org/TR/WD-xsl”> <xsl:template match=“/”> <HTML> <HEAD><TITLE> Class.xml Stylesheet</TITLE></HEAD> <BODY BGCOLOR=“red”> The homepage of <EM> <xsl:value-of select=‘’class/title”/> </EM> </BODY> </HTML> </xsl:template> </xsl:stylesheet>

  6. Try it yourself • Down load class.xml and class.xsl from homepage of the course. • Save it on your machine. • View the XML file with web browser. • Add the line that instructs the browser which stylesheet to use to format the XML (add it to second line). • View the XML file again.

  7. XSL • The first line of the XSL file shows that XSL itself is written in XML. (<?xml version=“1.0” ?>). • Line: <xsl:stylesheetxmlns:xsl=“http://www.w3.org/TR/WD-xsl”> tells the browser that this is a XSL stylesheet. • The XSL tags specify the rules to be applied to elements or attributes of the XML. Any other tag, including HTML tags, or piece of text will be kept as it is.

  8. XSL paths • Using XSL paths we can display the content of the elements or values of the attributes. • “/” by itself represents the root element. • When “/” is used as separator between two elements it indicates a move one level down the hierarchy. • Example: / , class, class/title or class/students/student/name/first

  9. XSL Paths • The browser can also pick out and use attribute values. The syntax is @attributName • Example: class/students/student/major/@decided.

  10. XSL template • Each template contains rules to apply when an element is matched with the path specified as value of the match attribute. • Thus,<xsl:template match=“/”> …. </xsl:template> means apply the rules within the start and end tags to the root element.

  11. XSL value-of • The <xsl:value-of select=“….”> element is used to extract the value of the element or attribute specified in select attribute. • Examples: <xsl:value-of select=“class/title”> <xsl:value-of select=“class/students/student/name/first ”> <xsl:value-of select=“class/students/student/major/@decided”>

  12. Do it yourself 1-Copy this piece of XML and save it as note.xml: <?xml version="1.0" ?> <note> <from>John</from> <to>Merry</to> <message title=“Reminder”>Don’t forget mer</message> </note> 2- View it using an web browser.

  13. Do it yourself 3- Write an XSL stylesheet for note which displays note as: There was a message from John to Merry with title Reminder. 4- Note John is written in bold and Merry italic. 5- Name the stylesheet as note.xsl 5- Add the line which instructs the browser to style note.xml with note.xsl. 6- View note.xml with a web browser.

  14. Do it yourself 3- Write an XSL stylesheet for note which displays note as: There was a message from John to Merry with title Reminder. 4- Note John is written in bold and Merry italic. 5- Name the stylesheet as note.xsl 5- Add the line which instructs the browser to style note.xml with note.xsl. 6- View note.xml with a web browser.

  15. Redo it. • Write an XSL stylesheet which displays the note.xml in the following form (HTML table):

  16. <?xml version="1.0" ?> <xsl:stylesheetxmlns:xsl="http://www.w3.org/TR/WD-xsl"> <xsl:template match="/"> <HTML> <HEAD><TITLE> Note Stylesheet</TITLE></HEAD> <BODY> There was a message from <B> <xsl:value-of select="note/from"/> </B> (Sample Solution) to <I> <xsl:value-of select="note/to"/> </I> with title <xsl:value-of select="note/message/@title"/>. </BODY> </HTML> </xsl:template> </xsl:stylesheet>

  17. <?xml version="1.0" ?> <xsl:stylesheetxmlns:xsl="http://www.w3.org/TR/WD-xsl"> <xsl:template match="/"> <HTML> <HEAD><TITLE> Note Stylesheet </TITLE></HEAD> <BODY> <TABLE BORDER="5" CELLPADDING="5"> <TR> <TH>From</TH> <TH>To</TH> <TH>Message Title</TH> </TR> <TR> <TD> (Sample Solution) <xsl:value-of select="note/from"/> </TD> <TD> <xsl:value-of select="note/to"/> </TD> <TD> <xsl:value-of select="note/message/@title"/> </TD> </TR> </TABLE> </BODY> </HTML> </xsl:template> </xsl:stylesheet>

  18. HW2 • I posted assignment #2. • Let’s review it together.

  19. More XML • Create your own XML file for a Lunch Menu. The root element should be <lunch_menu>. The sub elements of <lunch_menu> are <food> corresponding to each food in the menu. Then each <food> element has a number of attributes or child elements (your choice) such as name, price, calories,…. • Add at least two entries to your XML tree. • View the result using a web browser. (Make sure it is well-formed).

  20. <?xml version="1.0" ?> <lunch_menu> <food> <name>Cheese Burger</name> <price>$5.95</price> <calories>650</calories> </food> <food> <name>Macaroni and Cheese</name> <price>$7.95</price> <calories>900</calories> (Sample Solution) </food> <food> <name>Hot Dog</name> <price>$3.95</price> <calories>500</calories> </food> </lunch_menu>

More Related