XSLT is easy to get started with the second chapter: an example of XSLT

xiaoxiao2021-03-06  41

2. Example of XSLT

2.1 How XSLT converts XML

2.2 an instance

2.3 Process Analysis

2.4 Use of XSLT

2.1 How XSLT converts XML

We play a fun, you play the plasticine, press the different molds to make the shape of the need. If we assume that the XML data document is a big plasticine, XSLT is like a mold, and it is necessary to make a needed shape.

Specifically look at the following procedure:

We entered the XML original document, use XSL as a template, through the conversion engine, the final output required HTML document. The conversion engine is the process of "force one according to force" in the metaphor. In specific applications, there are special software to implement this conversion process, named XML Processor. There is already a lot of Processor software (hereinafter referred to in detail below), and XML Processor has been embedded in IE5.5.

2.2 an instance

Now let's look at a simple XSLT actual application example and get some sense of understanding. Many web designers see the code similar to HTML will be relieved, the code is kind and familiar.

Example 1: "Hello, World!"

Hello World as the first tutorial is already a practice in the program language. We also follow this practice to see how to use XSLT to display "Hello World". Although this example doesn't have any practical use, please don't worry, there is more detailed example.

Step 1: Create to enter the XML document Hello.xml.

Hello, World!

This is a very simple XML document that contains only a node XML tree.

Step 2: Establish a XSLT document Hello.xsl. Tip: The default XSLT file has the name of .xsl.

first xslt example </ title></p> <p></ hEAD></p> <p><body></p> <p><p> <xsl: value-of select = "greeting" /> </ p></p> <p></ body></p> <p></ html></p> <p></ xsl: template></p> <p></ xsl: stylesheet></p> <p>You can now open this hello.xsl file with IE5.0 or above, see the XSL tree.</p> <p>Step 3: Call this XSL file in XML. Modify the code for Hello.xml to:</p> <p><? Xml Version = "1.0" encoding = "ISO-8859-1"?></p> <p><? xml-stylesheet type = "text / xsl" href = "hello.xsl"?></p> <p><greeting> Hello, World! </ greeting></p> <p>OK, all the code has been completed by this step, followed by using a XSLT processor (XML processor) to perform Hello.xml, you can see the result of "HelloWorld". The popular processor software has the following:</p> <p>(1) .james clars' XT. Download URL: http://www.jclark.com/xml/xt.html</p> <p>(2). IBM's XML for Java package, named LotusxSL. Download URL: www.alphaworks.ibm.com/tech/xml4j</p> <p>(3). Saxon. Download URL: http://www.wrox.com</p> <p>(4). Microsoft's MSXML3. Download URL: http://www.microsoft.com/xml</p> <p>Some netizens should ask, I want to see what the effect of quot; hello world "should be done? In Microsoft's IE5.5 embedded MSXML3 interpreter, you can open the hello.xml file with IE5.5, You can see the result. If you only see the XML tree, not a separate "Hello</p> <p>World "words, indicating that your browser does not have MSXML3 version.</p> <p>What should I do if I don't want to see it? Then use the old approach in our XML tutorial, use JS implementation. (This has exceeded the scope of this article, but in order to be more intuitive, we provide example code here.) The following is an implementation code that can be saved as hello.htm, Hello.xml, Hello .xsl is placed in the same directory. Finally, you can see the effect with IE5.0 or later.</p> <p><html></p> <p><HEAD></p> <p><script language = "javascript" for = "window" Event = "Online"></p> <p>VAR XMLDoc = New ActiveXObject ("Microsoft.xmLDom");</p> <p>Xmldoc.async = "false";</p> <p>XMLDoc.Load ("Hello.xml");</p> <p>Nodes = xmldoc.documentelement.childnodes;</p> <p>Greeting.innertext = nodes.Item (0) .text;</p> <p></ script></p> <p><title> first xslt example </ title></p> <p></ hEAD></p> <p><body bgcolor = "# ffffff"></p> <p><span id = "greeting"> </ span> <br></p> <p></ body></p> <p></ html></p> <p>2.3 Process Analysis</p> <p>If you see the effect, you may want to know the specific meaning of these codes, let's explain in detail: see the hello.xsl file</p> <p><? Xml Version = "1.0" encoding = "ISO-8859-1"?></p> <p>This is the first line code of the standard XML document, because the XSLT itself is also an XML document. Encoding properties are used to define the form of coding usage, ISO-8859-1 mainly supports Western Europe and North American language coding. If you want to use Simplified Chinese, you should write:</p> <p><? XML Version = "1.0" encoding = "GB2312"?></p> <p>The next code is: <XSL: Stylesheet</p> <p>XMLns: XSL = "http://www.w3.org/1999/xsl/transform"</p> <p>Version = "1.0"></p> <p>This is the standard XSLT file first line code. XSL: Stylesheet code means processing documents as a style sheet (STYLESHEET). XMLns: XSL attribute is a namespace declaration, as in XML, using methods in XML, to prevent element name repetition and confusion. Where the prefix XSL means that the elements used in the document abide by the W3C's XSLT specification. The last Version property Description Style Table is only using XSLT</p> <p>1.0 standard function, this is also currently only standards.</p> <p><XSL: Template Match = "/"></p> <p>A <XSL: Template> element defines a template rule. Property Match = "/" Description XML source document, the starting point for this template rule. "/" Is an XPath syntax, which will be described in detail later, "/" "/" represents the root of the XML tree (root).</p> <p>The next code is:</p> <p><html></p> <p><HEAD></p> <p><title> first xslt example </ title></p> <p></ hEAD></p> <p><body></p> <p><p> <xsl: value-of select = "greeting" /> </ p></p> <p></ body></p> <p></ html></p> <p>Description: When the template rule is triggered, the content of the template will control the result of the output. In the example, most of the template is composed of HTML elements and text. Only the <xsl: value-of> element is a XSLT syntax, where <XSL: value-of> is the role of <XSL: value-of> is to copy the value of a node in the original document to the output document. The select property specifies the node name to be processed in detail. This is the XPath syntax, "greeting" means looking for elements named Greeting, and manages this node with template. Specifically, find the <greeting> element, then the value of the element "Hello</p> <p>World "Press template to copy to the output file.</p> <p>Tip: Since the XML document is a strict hierarchy (view XML file with IE5, you will see the XML document similar to multi-level associated menu), so our image is called the XML document as a document tree, which is called a node of the tree. . The root element is root node.</p> <p>Finally close all elements:</p> <p></ xsl: template></p> <p></ xsl: stylesheet></p> <p>Ok, the example explained. Have you thought about why you want to use such a complex way to display "Hello World"?</p> <p>The key is not on the surface, but in the substance: use this method, Hello World can be extracted from the XML document and use a variety of different XSLT template processing to output documents of different needs. Let's take a look at the main use of XSLT:</p> <p>2.4 Use of XSLT</p> <p>The main use of XSLT is data conversion applications.</p> <p>Due to XML-based e-commerce, XSLT is also increasingly important as data conversion roles. For example, directly convert the data format of TV news into data format required for newspaper news; direct converting the stock data into a picture display on the web; statistics, sorting the EDI (electronic data exchange) data.</p> <p>XSLT is an ideal tool for processing similar work.</p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-56202.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="56202" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.039</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'M0jbInEzOlhlu2_2FrEuPvcQ3eA7doXLrQPxjCB_2FBcbH0CnMAnkGGk0VMHo4qObEdAZ7q1ydbMUBH4xU5fVhBCRg_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>