灵活调用xsl来解析xml文档

  • 来源: 中国IT实验室 作者: xuqingzhong   2008-06-02/10:17

  •      1.新建一个vs2003的web工程,取名为XMLTest

         2.将工程目录下的WebForm1.aspx中内容全部删除,只留下顶部的一条语句:

         <%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="XMLTest.WebForm1" %>


          3.修改WebForm1.aspx.cs中内容,在Page_Load中加入:

        XmlDocument doc=new XmlDocument();
        String xmlfile=string.Empty;
        xmlfile=Context.Request.PhysicalApplicationPath+(Request.QueryString["sel"].ToString()=="xml"?"\\hello.xml":"\\hello.xsl");
        doc.Load(xmlfile);
        Response.Write(doc.InnerXml);


         4.在工程根目录下新增test.htm,并设为工程首页:

    <html>
    <head>
      <title></title>
    </head>
    <body>
      <div id="resTree"></div>
      <FONT face="宋体"></FONT><input type="button" value="执行" onclick="GetXml()"><BR>
      <script language="JScript">
      var srcTree,xsltTree,xt;
      var http_request = false;
       
      function GetXml()
      {    
       srcTree = new ActiveXObject("Msxml2.FreeThreadedDOMDocument");
        srcTree.async=false;
        xsltTree= new ActiveXObject("Msxml2.FreeThreadedDOMDocument");
        xsltTree.async = false;
        xt=new ActiveXObject("MSXML2.XSLTemplate");
       resTree.innerHTML="";
        makeRequest("WebForm1.aspx?sel=xml",GetXml_CB);
      }
        
        function makeRequest(url,callback) {
            http_request = false;
            if (window.XMLHttpRequest) { // Mozilla, Safari,...
                http_request = new XMLHttpRequest();
                if (http_request.overrideMimeType) {
                    http_request.overrideMimeType('text/xml');
                }
            } else if (window.ActiveXObject) { // IE
                try {
                    http_request = new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                    try {
                        http_request = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (e) {}
                }
            }

            if (!http_request) {
                alert('Giving up :( Cannot create an XMLHTTP instance');
                return false;
            }
            http_request.onreadystatechange = callback;
            http_request.open('GET', url, true);
            http_request.send(null);
        } #p#分页标题#e#

        function GetXml_CB() {

            if (http_request.readyState == 4) {
                if (http_request.status == 200) {    
        srcTree.loadXML(http_request.responseText);
        makeRequest("WebForm1.aspx?sel=xsl",GetXsl_CB);
                } else {
                    alert('There was a problem with the request.');
                }
            }

        }
        
        function GetXsl_CB(){
           if (http_request.readyState == 4) {
             if (http_request.status == 200) {
           xsltTree.loadXML(http_request.responseText);
           xt.stylesheet=xsltTree;
           var proc=xt.createProcessor();
           proc.input=srcTree;
           proc.transform();
           resTree.innerHTML=proc.output;
                } else {
                    alert('There was a problem with the request.');
                }
            }
      
        }

        function makeRequest(url,callback) {
         http_request = false;
         if (window.XMLHttpRequest) { // Mozilla, Safari,...
                http_request = new XMLHttpRequest();
                if (http_request.overrideMimeType) {
                    http_request.overrideMimeType('text/xml');
                }
            } else if (window.ActiveXObject) { // IE
                try {
                    http_request = new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                    try {
                        http_request = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (e) {}
                }
            }

            if (!http_request) {
                alert('Giving up :( Cannot create an XMLHTTP instance');
                return false;
            }
            http_request.onreadystatechange = callback;
            http_request.open('GET', url, true);
            http_request.send(null);
        }

      </script>

    </body>
    </html>


         5.运行工程,看看效果吧! 

         hello.xml(注意:我的xml文档中并没有指定对应的xsl解析文件名)

    <?xml version='1.0'?> #p#分页标题#e#

    <breakfast-menu>
      <food>
        <name>Belgian Waffles</name>
        <price>$5.95</price>
        <description>Two of our famous Belgian Waffles 
          with plenty of real maple syrup.</description>
        <calories>650</calories>
      </food>
      <food>
        <name>Strawberry Belgian Waffles</name>
        <price>$7.95</price>
        <description>Light Belgian waffles covered with 
         strawberries and whipped cream.</description>
        <calories>900</calories>
      </food>
      <food>
        <name>Berry-Berry Belgian Waffles</name>
        <price>$8.95</price>
        <description>Light Belgian waffles covered 
          with an assortment of fresh berries 
          and whipped cream.</description>
        <calories>900</calories>
      </food>
      <food>
        <name>French Toast</name>
        <price>$4.50</price>
        <description>Thick slices made from our homemade 
         sourdough bread.</description>
        <calories>600</calories>
      </food>
      <food>
        <name>Homestyle Breakfast</name>
        <price>$6.95</price>
        <description>Two eggs, bacon or sausage, toast, 
          and our ever-popular hash browns.</description>
        <calories>950</calories>
      </food>
    </breakfast-menu>

         hello.xsl

    <?xml version="1.0"?>
    <xsl:stylesheet version="1.0"  xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
      <xsl:template match="/breakfast-menu">

            <xsl:for-each select="food">
              <DIV STYLE="background-color:teal; color:white; padding:4px">
                <SPAN STYLE="font-weight:bold; color:white"><xsl:value-of select="name"/></SPAN>
                至 <xsl:value-of select="price"/>
              </DIV>
              <DIV STYLE="margin-left:20px; margin-bottom:1em; font-size:10pt">
                <xsl:value-of select="description"/>
                <SPAN STYLE="font-style:italic">
                  <xsl:value-of select="calories"/> 嘿嘿
                </SPAN>
              </DIV>
            </xsl:for-each>

      </xsl:template>
    </xsl:stylesheet>


         xml文档只有纯粹的数据,如果需要显示到html页面中的话,一般需要使用定制的xsl文档来解析,或者手工通过js来读取xml中的值显示到html中的dom树中,当使用xsl文档来解析时,相应的xml文档中必须指定对应的xsl文档才能正常显示,但当有些程序动态输出xml文档时,并没有指定相应的xsl文档,这时就必须通过其它途径来加载相应的xsl文档来解析,当然,在服务器端输出xml文档时,通过一些xml api也可以实现,我这儿描述的是通过js来实现的一种方式。用这种方式的话,就抛开了服务器平台的限制,服务器端只需要输出相应的xml文档(.net/j2ee都可以),并且将对应的xsl文档输出给客户端(可以输出流或直接在客户端加载xsl文档)。#p#分页标题#e#

         这里有几个需要注意的地方,我们一般是使用Msxml2.Document组件来加载xml文档的,但当动态使用xsl解析xml文档时,必须使用Msxml2.FreeThreadedDOMDocument这种自由线程的组件,同时使用MSXML2.XSLTemplate模板组件来加载xml,xsl数据,通过MSXML2.XSLTemplate的transform方法,就可以动态的用xsl来解析xml数据了,另外,IE5开始,系统默认的xml组件是msxml2,如果需要使用更新的msxml组件需要安装更新的msxml组件包,并指定新的名称,例如Msxml2.FreeThreadedDOMDocument.4.0,现在最新的msxml组件是6.0beta,可在M$网站下载。


    评论 {{userinfo.comments}}

    {{money}}

    {{question.question}}

    A {{question.A}}
    B {{question.B}}
    C {{question.C}}
    D {{question.D}}
    提交

    驱动号 更多