获取xml元素属性值并设置为html ul li list type

时间:2013-04-24 10:47:02

标签: javascript html xml xslt

这是我的xml文件: -

<root>
  <child_1 entity_id = "1" value="Game" parent_id="0">
    <child_2 entity_id="2" value="Activities" parent_id="1">
      <child_3 entity_id="3" value="Physical1" parent_id="2">
        <child_6 entity_id="6" value="Cricket" parent_id="3">
          <child_7 entity_id="7" value="One Day" parent_id="6"/>
        </child_6>
      </child_3>
      <child_4 entity_id="4" value="Test1" parent_id="1">
        <child_8 entity_id="8" value="Test At Abc" parent_id="4"/>
      </child_4>
      <child_5 entity_id="5" value="Test2" parent_id="1">
        <child_9 entity_id="9" value="Test At Xyz" parent_id="5"/>
      </child_5>
    </child_2>
   <child_10 entity_id="10" value="Region" parent_id="1">
      <child_11 entity_id="11" value="ABC" parent_id="10">
        <child_12 entity_id="12" value="XYZ" parent_id="11">
          <child_13 entity_id="13" value="ABC123" parent_id="12"/>
        </child_12>
      </child_11>
  </child_10>
</child_1>
</root>

这里我想开始获取元素属性值Activities (child_2)

还有子子子值。
并设置为ul li之类的html格式 看起来像这样: -

<ul>
  <li>Activity</li>
  <ul>
    <li>Physical</li>
    <ul>
      <li>Cricket</li>
      <ul>
        <li>One-Day</li>
      </ul>
    </ul>
    <li>Test2</li>
    <ul>
      <li>Test At Abc</li>
    </ul>
    <li>Test3</li>
    <ul>
      <li>Test At Xyz</li>
    </ul>
  </ul>
</ul>

我不太了解xslt,但我认为解决这个问题很简单。
任何帮助都很好 感谢...

1 个答案:

答案 0 :(得分:1)

这将产生您描述的输出:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html" indent="yes" omit-xml-declaration="yes"/>

  <xsl:template match="*" mode="item">
    <li>
      <xsl:value-of select="@value" />
    </li>
    <xsl:apply-templates select="current()[*]" />
  </xsl:template>

  <xsl:template match="*/*">
    <ul>
      <xsl:apply-templates select="*[1] | node()[current()/ancestor::*[2]]" 
                           mode="item" />
    </ul>
  </xsl:template>
</xsl:stylesheet>

但是,您描述的输出不合法HTML(ul s不能直接包含其他ul s。这将产生有效的HTML:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html" indent="yes" omit-xml-declaration="yes"/>

  <xsl:template match="*" mode="item">
    <li>
      <xsl:value-of select="@value" />
      <xsl:apply-templates select="current()[*]" />
    </li>
  </xsl:template>

  <xsl:template match="*/*">
    <ul>
       <xsl:apply-templates select="*[1] | node()[current()/ancestor::*[2]]" 
                            mode="item" />
    </ul>
  </xsl:template>
</xsl:stylesheet>

在样本输入上运行时,结果为:

<ul>
  <li>Activities<ul>
      <li>Physical1<ul>
          <li>Cricket<ul>
              <li>One Day</li>
            </ul>
          </li>
        </ul>
      </li>
      <li>Test1<ul>
          <li>Test At Abc</li>
        </ul>
      </li>
      <li>Test2<ul>
          <li>Test At Xyz</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

呈现为:

      
  • 活动
            
    • Physical1
                  
      • 板球
                        
        • 一天
        •             
                  
      •         
            
    •       
    • 测试1
                  
      • 在Abc测试
      •         
            
    •       
    • 的Test2
                  
      • 在Xyz测试
      •         
            
    •