1 / 48

Displaying XML Document

Displaying XML Document. Web and Database Management System. XML and CSS. Web and Database Management System. Using CSS to Display XML Document. This is a simplest way to display the XML document We can simply create a css file with each XML’s tagname representing the separator

platt
Download Presentation

Displaying XML Document

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. Displaying XML Document Web and Database Management System

  2. XML and CSS Web and Database Management System

  3. Using CSS to Display XML Document • This is a simplest way to display the XML document • We can simply create a css file with each XML’s tagname representing the separator • We can use a browser to open the XML file • The browser will then render the XML document according to the style specified in the CSS file

  4. cd_catalog.css /* CSS Document */ CATALOG { background-color: #ffffff; width:100%; } CD { display:block; margin-bottom:30pt; margin-left:0; } TITLE { color:#FF0000; font-size:20pt; } ARTIST { color:#0000FF; font-size:20pt; } COUNTRY,PRICE,YEAR,COMPANY { display:block; color:#000000; margin-left:20pt; } cd_catalog.xml <?xml-stylesheet type="text/css" href="cd_catalog.css"?> <CATALOG> <CD> <TITLE>Empire Burlesque</TITLE> <ARTIST>Bob Dylan</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>Columbia</COMPANY> <PRICE>10.90</PRICE> <YEAR>1985</YEAR> </CD> ….. ….. ….. </CATALOG> Display XML Doc using CSS

  5. Result of XML and CSS • To display the xml document with its associated css is to simply open the xml file in a browser

  6. XSLT Web and Database Management System

  7. XSL and XSLT • XSL (EXtensible Stylesheet Language) is a style sheet language for XML documents • XSL describes how an XML document should be displayed • XSL consists of three parts: • XSLT - a language for transforming XML documents • XPath - a language for navigating in XML documents • XSL-FO - a language for formatting XML documents • XSLT stands for XSL Transformations which is how to transform XML documents into other formats

  8. What is XSLT? • XSLT stands for XSL Transformations • XSLT is the most important part of XSL • XSLT transforms an XML document into another XML document • XSLT uses XPath to navigate in XML documents • XSLT is a W3C Recommendation XSLT transforms an XML source-tree into an XML result-tree.

  9. XSLT • XSLT transforms each XML element into an (X)HTML element that can be recognized by browsers • With XSLT we can add/remove elements and attributes to or from the output file • We can rearrange and sort elements, perform tests and make decisions about which elements to hide and display, and a lot more • XSLT uses XPath to find information in an XML document

  10. Style Sheet Declaration • The root element that declares the document to be an XSL style sheet is <xsl:stylesheet> or <xsl:transform>. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> or <xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

  11. XSL Style Sheet with a Transformation Template <?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0“ xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <h2>My CD Collection</h2> <table border="1"> <tr bgcolor="#9acd32"> <th>Title</th> <th>Artist</th> </tr> <xsl:for-each select="catalog/cd"> <tr> <td><xsl:value-of select="title"/></td><td><xsl:value-of select="artist"/></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>

  12. Link XSL Style Sheet to XML Document <?xml version="1.0" encoding="ISO-8859-1"?> <?xml-stylesheet type="text/xsl" href="cdcatalog.xsl"?> <catalog> <cd> <title>Empire Burlesque</title> <artist>Bob Dylan</artist> <year>1985</year> </cd> . . </catalog>

  13. XSLT <xsl:template> Element • A template contains rules to apply when a specified node is matched • The <xsl:template> element is used to build templates • The value of the match attribute is an XPath expression • i.e. match="/" defines the whole document <?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version=“1.0” mlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> ………………… </xsl:template> The match="/" attribute associates template with the root of the XML source document.

  14. The <xsl:value-of> Element • <xsl:value-of> is used to extract value of an XML element and add it to the output stream • select attribute in the example, contains an XPath expression <table border="1"> <tr bgcolor="#9acd32"> <th>Title</th> <th>Artist</th> </tr> <tr> <td><xsl:value-of select=“catalog/cd/title” /></td> <td><xsl:value-of select=“catalog/cd/artist” /></td> </tr> </table>

  15. <xsl:value-of> Output My CD Collection

  16. The <xsl:for-each> Element • <xsl:for-each> element allows us to do looping in XSLT • It can be used to select every XML element of a specified node-set: <table border="1"> <tr bgcolor="#9acd32"> <th>Title</th> <th>Artist</th> </tr> <xsl:for-each select="catalog/cd"> <tr> <td><xsl:value-of select="title"/></td> <td><xsl:value-of select="artist"/></td> </tr> </xsl:for-each> </table>

  17. <xsl:for-each> Output

  18. Filtering the Output (for-each) • We can also filter output from XML file by adding a criterion to select attribute in the <xsl:for-each> element • Legal filter operators are: • = (equal) • != (not equal) • &lt; less than • &gt; greater than <xsl:for-each select="catalog/cd[artist='Bob Dylan']">

  19. XSLT <xsl:sort> Element • To sort the output, simply add an <xsl:sort> element inside the <xsl:for-each> element in the XSL file: <xsl:for-each select="catalog/cd"> <xsl:sort select="artist"/> <tr> <td><xsl:value-of select="title"/></td> <td><xsl:value-of select="artist"/></td> </tr> </xsl:for-each>

  20. <xsl:sort> Output My CD Collection

  21. Syntax: <xsl:if test="expression"> ...some output if the expression is true... </xsl:if> XSLT <xsl:if> Element • <xsl:if> element is used to put a conditional test against the content of the XML file. <xsl:for-each select="catalog/cd"> <xsl:if test="price &gt; 10"> <tr> <td><xsl:value-of select="title"/></td> <td><xsl:value-of select="artist"/></td> </tr> </xsl:if> </xsl:for-each>

  22. <xsl:if> Output My CD Collection

  23. Syntax: <xsl:choose> <xsl:when test="expression"> ... some output ... </xsl:when> <xsl:otherwise> ... some output .... </xsl:otherwise> </xsl:choose> XSLT <xsl:choose> Element • <xsl:choose> element is used in conjunction with <xsl:when> and <xsl:otherwise> to express multiple conditional tests.

  24. <xsl:choose> Example <xsl:for-each select="catalog/cd"> <tr> <td><xsl:value-of select="title"/></td> <xsl:choose> <xsl:when test="price &gt; 10"> <td bgcolor="#ff00ff"> <xsl:value-of select="artist"/></td> </xsl:when> <xsl:otherwise> <td><xsl:value-of select="artist"/></td> </xsl:otherwise> </xsl:choose> </tr> </xsl:for-each>

  25. <xsl:choose> Example <xsl:for-each select="catalog/cd"> <tr> <td><xsl:value-of select="title"/></td> <xsl:choose> <xsl:when test="price &gt; 10"> <td bgcolor="#ff00ff"><xsl:value-of select="artist"/></td> </xsl:when> <xsl:when test="price &gt; 9"> <td bgcolor="#cccccc"><xsl:value-of select="artist"/></td> </xsl:when> <xsl:otherwise> <td><xsl:value-of select="artist"/></td> </xsl:otherwise> </xsl:choose> </tr> </xsl:for-each>

  26. <xsl:choose> Output

  27. XSLT <xsl:apply-templates> Element • <xsl:apply-templates> element applies a template to the current element or to the current element's child nodes • If we add a select attribute to the, it will process only the child element that matches the value of the attribute • We can use the select attribute to specify the order in which the child nodes are processed.

  28. XSLT <xsl:apply-templates> Example <xsl:template match="/"> <html> <body> <h2>My CD Collection</h2> <xsl:apply-templates/> </body> </html> </xsl:template> <xsl:template match="cd"> <p> <xsl:apply-templates select="title"/> <xsl:apply-templates select="artist"/> </p> </xsl:template> <xsl:template match="title"> Title: <span style="color:#ff0000"> <xsl:value-of select="."/></span> <br /> </xsl:template> <xsl:template match="artist"> Artist: <span style="color:#00ff00"> <xsl:value-of select="."/></span> <br /> </xsl:template>

  29. XSLT <xsl:apply-templates> Output

  30. XPath Web and Database Management System

  31. XPath • XPath is a syntax for defining parts of an XML document • XPath is used to navigate through elements and attributes in an XML document. • XPath is a major element in XSLT

  32. XPath Introduction • XPath Path Expressions • XPath uses path expressions to select nodes or node-sets in an XML document • XPath Standard Functions • XPath has functions for string values, numeric values, date and time comparison, node and QName manipulation, sequence manipulation, Boolean values, and more • XPath is Used in XSLT • XPath is a major element in the XSLT standard. Without XPath knowledge we will not be able to create XSLT documents

  33. XPath Nodes • There are seven kinds of nodes: • element, attribute, text, namespace, processing-instruction, comment, and document nodes. <?xml version="1.0" encoding="ISO-8859-1"?> <bookstore> <book> <title lang="en">Harry Potter</title> <author>J K. Rowling</author> <year>2005</year> <price>29.99</price> </book> </bookstore> <bookstore> is root element node, <author>J K. Rowling</author> is element node, and lang="en" is attribute node.

  34. Terminology • Parent • Each element and attribute has one parent • Children • Element nodes may have zero, one or more children • Siblings • Nodes that have the same parent • Ancestors • A node's parent, parent's parent, etc. • Descendents • A node's children, children's children, etc.

  35. XPath Syntax • XPath uses path expressions to select nodes or node-sets in an XML document. <?xml version="1.0" encoding="ISO-8859-1"?> <bookstore> <book> <title lang="eng">Harry Potter</title> <price>29.99</price> </book> <book> <title lang="eng">Learning XML</title> <price>39.95</price> </book> </bookstore>

  36. Selecting Nodes • The most useful path expressions are listed below:

  37. Selecting Nodes (Example)

  38. Predicates • Predicates are used to find a specific node or a node that contains a specific value. • Predicates are always embedded in square brackets.

  39. Predicates (cont)

  40. Selecting Unknown Nodes • XPath wildcards can be used to select unknown elements • Selecting nodes using wildcards

  41. Selecting Several Path • By using the | operator in an XPath expression, we can select several paths

  42. XPath Axes

  43. Location Path Expression (Axes) • An axis (defines the tree-relationship between the selected nodes and the current node) • a node-test (identifies a node within an axis) • zero or more predicates (to further refine the selected node-set) axisname::nodetest[predicate] <?xml version="1.0" encoding="ISO-8859-1"?> <bookstore> <book> <title lang="eng">Harry Potter</title> <price>29.99</price> </book> <book> <title lang="eng">Learning XML</title> <price>39.95</price> </book> </bookstore>

  44. Axes Examples

  45. XPath Functions • XPath provides a group of functions including: • Accessor, Error and Trace, Numeric, String, AnyURI, Boolean, Duration/Date/Time, QName, Node, Sequence, and Context • The default prefix for the function namespace is fn: • The URI of the function namespace is: http://www.w3.org/2005/xpath-functions

  46. XPath Functions Example • Some examples from context function

  47. <html> • <body> • <script type="text/javascript"> • if(window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari • xmlhttp=new XMLHttpRequest(); • } • else { // code for IE6, IE5 • xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); • } • xmlhttp.open("GET","cd_catalog.xml",false); • xmlhttp.send(); • xmlDoc=xmlhttp.responseXML; • document.write("<table border='1'>"); • var x=xmlDoc.getElementsByTagName("CD"); • for(i=0;i<x.length;i++) { • document.write("<tr><td>"); • document.write(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue); • document.write("</td><td>"); • document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue); • document.write("</td></tr>"); • } • document.write("</table>"); • </script> • </body> • </html>

More Related