DT's Blog
0%

xsl_xml

Posted on In

XML Sample

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?xml version="1.0" encoding="UTF-8"?>
<WebSites>
	<Site>
		<name>EPLM R2017 Docs</name>
		<url>/B418doc/index.htm</url>
		<category>Docs</category>
	</Site>
	<Site>
		<name>EPLM R2013 Docs</name>
		<url>/B214doc/DShomepage_English.htm</url>
		<category>Docs</category>
	</Site>	
	<Site>
		<name>MyBlog</name>
		<url>https://blog.ddong.online</url>
	</Site>
	<Site>
		<name>JAVA 8 Docs</name>
		<url>https://docs.oracle.com/javase/8/docs/api/overview-summary.html</url>
		<category>Docs</category>
	</Site>
</WebSites>

XSL Sample

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:template match="/">
    <html>
      <body>
        <h2>My Web Sites Collection - DT</h2>
        <table border="1">
          <tr bgcolor="#9acd32">
            <th>Site</th>
            <th>URL</th>
            <th>Description</th>
          </tr>
          <xsl:for-each select="WebSites/Site">
            <xsl:sort select="category"/>
            <tr>
              <xsl:choose>
                <xsl:when test="category = 'EPLM'">
                  <td bgcolor="grey">
                    <xsl:value-of select="name"/>
                  </td>
                  <td>
                    <a href="{url}" rel="noopener noreferrer" target="_blank">
                      <xsl:value-of select="url"/>
                    </a>
                  </td>
                  <td bgcolor="grey">
                    <xsl:value-of select="category"/>
                  </td>
                </xsl:when>
                <xsl:when test="category = 'ALPIM'">
                  <td bgcolor="yellow">
                    <xsl:value-of select="name"/>
                  </td>
                  <td>
                    <a href="{url}" rel="noopener noreferrer" target="_blank">
                      <xsl:value-of select="url"/>
                    </a>
                  </td>
                  <td bgcolor="yellow">
                    <xsl:value-of select="category"/>
                  </td>
                </xsl:when>
                <xsl:when test="category = 'AFP'">
                  <td bgcolor="red">
                    <xsl:value-of select="name"/>
                  </td>
                  <td>
                    <a href="{url}" rel="noopener noreferrer" target="_blank">
                      <xsl:value-of select="url"/>
                    </a>
                  </td>
                  <td bgcolor="red">
                    <xsl:value-of select="category"/>
                  </td>
                </xsl:when>
                <xsl:when test="category = 'Docs'">
                  <td bgcolor="green">
                    <xsl:value-of select="name"/>
                  </td>
                  <td>
                    <a href="{url}" rel="noopener noreferrer" target="_blank">
                      <xsl:value-of select="url"/>
                    </a>
                  </td>
                  <td bgcolor="green">
                    <xsl:value-of select="category"/>
                  </td>
                </xsl:when>
                <xsl:otherwise>
                  <td>
                    <xsl:value-of select="name"/>
                  </td>
                  <td>
                    <a href="{url}" rel="noopener noreferrer" target="_blank">
                      <xsl:value-of select="url"/>
                    </a>
                  </td>
                  <td>
                    <xsl:value-of select="category"/>
                  </td>
                </xsl:otherwise>
              </xsl:choose>
            </tr>
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>

Html & JavaScript combine

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc(filename){
  if (window.ActiveXObject){
    xhttp = new ActiveXObject("Msxml2.XMLHTTP");
  }else{
    xhttp = new XMLHttpRequest();
  }
  xhttp.open("GET", filename, false);
  try {xhttp.responseType = "msxml-document"} catch(err) {} // Helping IE11
  xhttp.send("");
  return xhttp.responseXML;
}
 
function displayResult(){
  xml = loadXMLDoc("mywebsites.xml");
  xsl = loadXMLDoc("mywebsites.xsl");
  // code for IE
  if (window.ActiveXObject || xhttp.responseType == "msxml-document"){
      ex = xml.transformNode(xsl);
      document.getElementById("example").innerHTML = ex;
  }else if (document.implementation && document.implementation.createDocument){
    // code for Chrome, Firefox, Opera, etc.
    xsltProcessor = new XSLTProcessor();
    xsltProcessor.importStylesheet(xsl);
    resultDocument = xsltProcessor.transformToFragment(xml, document);
    document.getElementById("example").appendChild(resultDocument);
  }
}
</script>
</head>
<body onload="displayResult()">
<div id="example" />
</body>
</html>