http://s6.postimg.org/5zzsratqp/output.jpg <-预期的输出->
以下是我提供的XML文件,因此我需要使用HTML,CSS,Javascript和XSLT以表格形式显示数据。但是,查找标签具有挑战性,并且使用我创建的样式表,什么都没有出现。有什么建议吗?谢谢
XML数据
<?xml-stylesheet type="text/xsl" href="stylesheet.xsl"?>
<data>
<object instance="197784" dataInstance="41" name="Give As You Earn Flex" itemNumber="1" pageNumber="1" pagesAvailable="1">
<property id="{00fd4f20-8e9c-414f-b34f-2abd4a4dc3fe}" name="Effective Date">
<format id="{332f8155-7253-4dc9-896c-61a3a3d19816}" answer="30/05/2014 13:39:55" />
</property>
<property id="{ea61f121-1c2b-47df-91af-3806eba65c4b}" name="Benefit Type ID">
<format id="{05b7ea73-a86f-4119-b330-0a0f5a4e0143}" answer="GAYE" />
</property>
<object instance="197785" dataInstance="41" name="Default (GAYE)" itemNumber="1" pageNumber="1" pagesAvailable="1">
<property id="{7f428c44-7800-4972-ad37-a005824c251f}" name="Flex Default Amount">
<format id="{4cf95889-2249-4270-9ce0-9e2da5fedbb7}" answer="0" />
</property>
<property id="{cc70d36d-5700-41bf-9370-2ec34c6c7010}" name="Flex Default Cost">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
</object>
<object instance="197786" dataInstance="41" name="Model (GAYE)" itemNumber="1" pageNumber="1" pagesAvailable="1">
<property id="{ea123f721-1c2b-47df-91af-3806eba65c4b}" name="Chosen Charity">
<format id="{05b7ea73-a86f-4119-b330-0a0f5a4e0143}" answer="" />
</property>
<property id="{bf500440-3f1a-46ea-8937-1d8c4dfea274}" name="Flex Model Amount">
<format id="{4cf95889-2249-4270-9ce0-9e2da5fedbb7}" answer="0" />
</property>
<property id="{bf9af022-ba8b-46ed-b043-573c01ba2e1d}" name="Flex Model Cost">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
<property id="{2d94fe41-8492-4c5d-945a-a23bb5dfcf93}" name="Amount Liable for Tax">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
<property id="{8555974b-b80e-4704-9241-867cbb435523}" name="Amount Liable for NI">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
</object>
<object instance="197787" dataInstance="41" name="Requested (GAYE)" itemNumber="1" pageNumber="1" pagesAvailable="1">
<property id="{0a113492-faed-4c6e-be73-d6c14210f0b3}" name="Flex Requested Amount">
<format id="{4cf95889-2249-4270-9ce0-9e2da5fedbb7}" answer="0" />
</property>
<property id="{28db97f2-9346-498d-b0b7-724535af30c4}" name="Flex Requested Cost">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
</object>
<object instance="197788" dataInstance="41" name="Current (GAYE)" itemNumber="1" pageNumber="1" pagesAvailable="1">
<property id="{b0424854-bbf4-4299-080e-2480e6c09172}" name="Flex Current Amount">
<format id="{4cf95889-2249-4270-9ce0-9e2da5fedbb7}" answer="0" />
</property>
<property id="{2cb5ac07-a5c7-4bfd-9b15-925a6dd5ba6c}" name="Flex Current Discount Amount">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
<property id="{b8a7f2fe-9590-44ca-bc3d-027c76ff3dff}" name="Flex Current Value">
<format id="{05b7ea73-a86f-4119-b330-0a0f5a4e0143}" answer="0" />
</property>
<property id="{e133d446-443a-419e-812f-f6506f0101db}" name="Flex Current VAT Amount">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
<property id="{16d1795a-ad48-401e-9dc4-68f76310e238}" name="Flex Current Cost">
<format id="{c7cf6728-47b3-4851-9633-f689b5391e88}" answer="0.0000" indicator="GBP" />
</property>
</object>
<Object_ID ObjectName="Give As You Earn Flex" ParentDataInstance="47" ParentObjectInstance="197759" EmployeeObjectInstance="197993" EmployeeDataInstance="47" />
<ChildObject_ID ChildObjectName="Default (GAYE)" ChildObjectInstance="197785" />
<ChildObject_ID ChildObjectName="Model (GAYE)" ChildObjectInstance="197786" />
<ChildObject_ID ChildObjectName="Requested (GAYE)" ChildObjectInstance="197787" />
<ChildObject_ID ChildObjectName="Current (GAYE)" ChildObjectInstance="197788" />
</object>
<variables>
<variable type="request.querystring" name="DP" value="47:197738/47:197759/41:197784" />
<variable type="request.querystring" name="select" value="true" />
<variable type="ID" name="UserRole" value="Employee" />
<variable type="date" fulldate="14/08/2014 10:17:13" ukdate="14 August 2014" shortdate="14/08/2014" year="2014" month="8" monthname="August" day="14" timeGMT="14/08/2014 09:17:13" time="14/08/2014 10:17:13" />
</variables>
<options mode="Any Value" type="CoverLevel" inputName="Flex Model Amount|197786|41" modelValue="0" modelAdditionalValue="" currentValue="0" currentAdditionalValue="" formatting="Currency" suffix="Donation" minimum="1" maximum="11666.67" increment="0.01" charityName="">
<selectionText>Please select the amount that you would like to donate per pay period:</selectionText>
<additionalSelectionText />
<onChange>
validateDependants('',this.value,'No');toggleDeclarationBox(this.value)
</onChange>
<option value="0" location="0" cost="00" alias="No Donation" validation="No Cover" />
</options>
</data>
XSLT样式表
<?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>testing</h2>
<xsl:for-each select="data">
<xsl:value-of select="name"/>
<xsl:value-of select="property"/>
<xsl:value-of select="format"/>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
但是可以使用PHP XML解析器。它比XSLT麻烦得多,因为您需要开始考虑模板驱动语言而不是过程语言。这可能是一个很大的跳跃
您在评论中收到了此建议,但我不同意。是的,XSLT可能需要进行范式转换,如果您不能掌握声明性和功能范式,可能会很难,但是一旦掌握要点,它将节省大量时间(例如,下面的样式表花了我大约10分钟的时间,在命令式C#或PHP中,可能要花几个小时。通常,仅因为它要求您学习工具或语言,而辞退工具或语言不是一个好主意,除非替代方法是如此琐碎,以至于过大。
考虑到您输入的XML,我怀疑您的需求微不足道,并且使用XSLT可能是一件好事。是的,您需要掌握它,但是同样,您也已经掌握了其他编程语言,并且所有这些语言都需要经过一定的时间折衷才能有效使用它们。
遵循实用程序员的建议:每学完大约一门语言,就要每年学习一门新语言。掌握XSLT需要一到两周的时间,您已经达到了今年的目标;)。
一些不错的教程:
<xsl:for-each select="data">
您只有一个data
元素(XSLT不在标记中考虑,而是在元素中,这是从开始标记到结束标记及其包含的所有内容的全部内容),在其上使用for-each并没有多大意义,您只需删除此行或将其替换为xsl:apply-templates
。
<xsl:value-of select="name"/>
由于此行位于for-each内部,因此焦点位于data
元素上,name
此处的意思是“采用名为的元素,该元素name
是当前元素的子元素,即“的孩子data
”。您的输入中不存在这样的子母鹿。实际上,根本没有名称name
,只有属性的元素,就像@name
在XPath(XSLT用于选择节点的语言)中编写的那样。
<xsl:value-of select="property"/> <xsl:value-of select="format"/>
虽然这些元素确实存在,但它们并不在下面data
,请参阅前面的注释。
此外,如果您有正确的焦点,它们仍然不会执行任何操作,因为xsl:value-of
会获取节点的值,在元素的情况下(如果需要,在开始和结束标记之间)是该元素内的自由文本,到任何深度。它不是属性,注释或其他任何内容。在您的情况下,这些元素中没有自由文本,因此您将选择空白(或空白)。
给定的样式表示例代码表明您正在尝试这项技术,并且正在努力解决诸如焦点,上下文节点,结构,模板之类的概念。为了让您有一个良好的开端,我采用了您的输入XML,并制作了一个简单的XSLT样式表,其中每个步骤都带有注释。
样式表可用于XSLT 1.0及更高版本,并且可在内部和外部(脱机处理器)浏览器中使用。
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<!-- from SO: https://stackoverflow.com/questions/32418785/displaying-xml-data -->
<xsl:output method="html" indent="yes" />
<!-- the root node, our starting point -->
<xsl:template match="/">
<html>
<head>
<title>Hello world!</title>
</head>
<body>
<!-- instruct XSLT processor to process the children and place them under <body> -->
<xsl:apply-templates />
</body>
</html>
</xsl:template>
<!-- what to do with elements: process their children -->
<xsl:template match="node()">
<xsl:apply-templates />
</xsl:template>
<!-- what to do if you encounter a "main" object, right under <data> -->
<xsl:template match="data/object">
<h1><xsl:value-of select="@name" /></h1>
<h3>Properties:</h3>
<xsl:apply-templates />
</xsl:template>
<!-- what to do with <property> elements -->
<xsl:template match="property">
<div style="margin:0">
<span style="font-weight:bold"><xsl:value-of select="@name" />: </span>
<span>
<xsl:value-of select="format/@indicator" />
<xsl:text> </xsl:text>
<xsl:value-of select="format/@answer"/>
</span>
</div>
</xsl:template>
<!-- what to do with objects-under-main-object -->
<xsl:template match="object/object">
<h2><xsl:value-of select="@name" /></h2>
<!-- this will apply the property elements under <object> -->
<h3>Properties:</h3>
<xsl:apply-templates />
</xsl:template>
<!-- what to do with text nodes we are not interested in (default is they get output): ignore -->
<xsl:template match="text()" />
</xsl:stylesheet>
脱机运行此样式表时的输出(在网上您永远看不到输出,因此您应该避免在浏览器中进行测试是您应该避免的痛苦!),在我的情况下,使用oXygen可以,但是任何具有XSLT功能的环境都可以做到,例如Visual Studio,Eclipse或Stylus Studio是:
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Hello world!</title>
</head>
<body>
<h1>Give As You Earn Flex</h1>
<h3>Properties:</h3>
<div style="margin:0"><span style="font-weight:bold">Effective Date: </span><span> 30/05/2014 13:39:55</span></div>
<div style="margin:0"><span style="font-weight:bold">Benefit Type ID: </span><span> GAYE</span></div>
<h2>Default (GAYE)</h2>
<h3>Properties:</h3>
<div style="margin:0"><span style="font-weight:bold">Flex Default Amount: </span><span> 0</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Default Cost: </span><span>GBP 0.0000</span></div>
<h2>Model (GAYE)</h2>
<h3>Properties:</h3>
<div style="margin:0"><span style="font-weight:bold">Chosen Charity: </span><span> </span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Model Amount: </span><span> 0</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Model Cost: </span><span>GBP 0.0000</span></div>
<div style="margin:0"><span style="font-weight:bold">Amount Liable for Tax: </span><span>GBP 0.0000</span></div>
<div style="margin:0"><span style="font-weight:bold">Amount Liable for NI: </span><span>GBP 0.0000</span></div>
<h2>Requested (GAYE)</h2>
<h3>Properties:</h3>
<div style="margin:0"><span style="font-weight:bold">Flex Requested Amount: </span><span> 0</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Requested Cost: </span><span>GBP 0.0000</span></div>
<h2>Current (GAYE)</h2>
<h3>Properties:</h3>
<div style="margin:0"><span style="font-weight:bold">Flex Current Amount: </span><span> 0</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Current Discount Amount: </span><span>GBP 0.0000</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Current Value: </span><span> 0</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Current VAT Amount: </span><span>GBP 0.0000</span></div>
<div style="margin:0"><span style="font-weight:bold">Flex Current Cost: </span><span>GBP 0.0000</span></div>
</body>
</html>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句