xslt文件是xml的样式表文件,随着xml数据交换格式的普遍化,xslt也在很多方面得到了很大的应该。

应用1)页面的静态化技术。听说以前的csdn论坛就采用了服务器端生成xml,然后将生成静态文本的任务交给客户端,减少了服务器压力。

2)服务器控件的开发技术。比如Infragistics.WebUI.UltraWebGrid控件,客户端的排序翻页等等,无不看到xslt的影子。

3)自动化表单。根据数据库配置动态生成添加表单,并自动保存。那么这个表单的样式如何定义呢。这里可以考虑xslt了,目前正在做这方面的研究,

等有一点成果的时候,写出来和大家一起学习。

 

今天就来学学最基础的东西,看看客户端如果将xml通过xslt样式,表现成我们需要的html

xml文件如下:

 


  <Questions>
    
<Question Caption="问题一" Content="毕业院校" />
    
<Question Caption="问题二" Content="你有什么爱好">
      
<Answer Caption="A" Content="篮球" IsRight="true" />
      
<Answer Caption="B" Content="足球" IsRight="false" />
      
<Answer Caption="C" Content="羽毛球" IsRight="false" />
      
<Answer Caption="D" Content="舞蹈" IsRight="false" />
      
<Answer Caption="E" Content="游泳" IsRight="false" />
      
<Answer Caption="F" Content="其他" IsRight="false" />
    
</Question>
    
<Question Caption="问题三" Content="什么时候可以来上班?">
      
<Answer Caption="A" Content="一个星期" IsRight="true" />
      
<Answer Caption="B" Content="两个星期" IsRight="false" />
      
<Answer Caption="C" Content="三个星期" IsRight="false" />
      
<Answer Caption="D" Content="一个月" IsRight="false" />
    
</Question>
  
</Questions>
</Test>

 

xslt文件如下:

 


    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">
    
<xsl:output method="xml" indent="yes"/>

    
<xsl:template match="/">
          
<table width="100%" border="0">
            
<tr>
              
<td height="30px" align="center">
                
<h1>
                  
<xsl:value-of select="Test/@Caption"/>
                
</h1>
              
</td>
            
</tr>
          
</table>
        
<xsl:for-each select="Test/Questions/Question">
          
<table width="100%" border="1" cellspacing="0" cellpadding="0" bordercolordark="#0099FF" bordercolorlight="#FFFFFF">
            
<tr>
              
<td class="td">
                
<xsl:value-of select="@Caption"/>
                
<xsl:value-of select="@Content"/>
              
</td>
            
</tr>
            
<xsl:for-each select="Answer">
              
<tr>
                
<td class="td">
                  (
<xsl:value-of select="@Caption"/>)
                  
<xsl:value-of select="@Content"/>
                
</td>
              
</tr>
            
</xsl:for-each>
          
</table>
          
<table width="100%" border="0">
            
<tr>
              
<td height="3px"></td>
            
</tr>
          
</table>
        
</xsl:for-each>
    
</xsl:template>
</xsl:stylesheet>

 

客户端页面如下:

 

 pageLoad(sender,eventArgs)
{
    var xml=sg.xmlDocument();
    xml.async
=false;//一定要同步载入
    xml.load(xmlPath);

    
var xslt=sg.xmlDocument();
    xslt.async
=false;
    xslt.load(xsltPath);

    
//document.write(xml.transformNode(xslt));
    TestContainer.innerHTML=xml.transformNode(xslt);
}
</script>
<div id="TestContainer" style="width:90%;overflow-y:auto;">

 

 

1)注意一定要同步载入,否则可能出错。

2)关于xpath的相关技术,可以去w3school网站看看。

本文虽然写的很简单,但是揭示了基本的原理,更多深层的挖掘待以后的文章详述

相关文章:

  • 2022-01-14
  • 2022-12-23
  • 2022-12-23
  • 2021-12-25
  • 2021-05-28
  • 2021-10-27
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-03-10
  • 2022-01-12
  • 2021-06-04
相关资源
相似解决方案