Jumat, 16 Maret 2012

PPWEB resume 5

XSLT
Extensible 
Stylesheet 
Language  
Transformation

XSLT digunakan untuk mentransformasi XML ke dalam format apapun, biasanya (X)HTML.

Dalam file xml tambahkan
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="customers.xsl"?>
<!DOCTYPE customers [

href customer di atas tujukan pada file xsl yang akan kita buat.

Contoh file XSL :
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:template match="/">
        <html>
            <head>
                <title>Customer List</title>
                    <link rel="stylesheet" href="mystyle.css" />
                        <style>
                                body {
                                background-color: gray;
                                }
                                table {
                                background-color: white;
                                }
                </style>
            </head>
            <body>
                <table border="1">
                    <tr>
                        <th>Customer ID</th>
                        <th>Nama</th>
                        <th>Alamat</th>
                        <th>Telp</th>
                        <th>Email</th>
                        <th>Photo</th>
                        </tr>
                            <xsl:for-each select="customers/customer">
        <tr>
                            <xsl:choose>
                            <xsl:when test="@type='retailer'">
                               <td style="background-color: lime;">
                                    <xsl:value-of select="@cust_id" />
                                </td>
                            </xsl:when>
                            <xsl:otherwise>
                                <td style="background-color: skyblue;">
                            <xsl:value-of select="@cust_id" />
                                </td>
                                    </xsl:otherwise>
                                    </xsl:choose>
                                <td>
                                    <xsl:value-of select="name/last_name" />&#160;
                                    <xsl:value-of select="name/first_name" />
                                </td>
                                <td>
                                    <xsl:value-of select="address" />
                                </td>
                                <td>
                                    Home: <xsl:value-of select="phone/home" /><br />
                                    Cell: <xsl:value-of select="phone/cell" />
                                </td>
                                <td>
                                    <xsl:value-of select="email" />
                                </td>
                                <td>
                                    <xsl:value-of select="photo/@file" />
                                </td>
                            </tr>
                                </xsl:for-each>
                            </table>
                        </body>
</html>
</xsl:template>
</xsl:stylesheet>

Dari file di atas dapat didapat bahwa xsl mensupport penggunaan
-          perulangan dengan menggunakan
<xsl : template match = “/”>
  <xsl:for-each select= “customers/customers”>
  </xsl:for-each>
</xsl:template>

-          percabangan
<xsl:choose>
  <xsl:when>  </xsl:when>
  <xsl:otherwise>   </xsl:otherwise>
</ xsl:choose >

Dalam file xsd untuk menggunakan spasi atau jika di xsd dinamakan white space gunakan ISO-encode yaitu &#160;




DOM
Document 
Object 
Model

-          Document is the web page, not the site
-          Object is anyting you see in the web page (image, link, button, table, dll)
-          Model is the “tree view” of the web page (tag-tag html dari object)

Contoh DOM :
<HTML>
                <HEAD>
                                <TITTLE >ISI</TITTLE>
                </HEAD>
<BODY>
<!-- ini baris komen
-->
                <P ID=”XXX”>HAHA</P>
                <UL>
                                <LI>A</LI>
                                <LI CLASS = “XX”>B</LI>
                                <LI>C</LI>
                </UL>
</BODY>
</HTML>

DOM dari script HTML di atas :








   
DOM memiliki :
a.       Node
Tipe – tipe node :
o   Element node
o   Attribute node
o   Text node
o   Comment node
b.      Leaf

Manfaat DOM (scripting) :
-          Get the web title
-          Find the first paragraph, then change the value
-          Change the background color of a table
-          Find the logo image, then move it to 100 px to the right
-          Added some function to the button(s) link(s)
-          Create new node (any type)