WebBrowser控件显示XML流 - 令狐冲和酒壶 - 博客园

WebBrowser控件显示XML流

        VS2005里集成的WebBrowser控件，就是一个IE浏览器，如果想用它来相显示XML字符串，并达到IE的效果，我总结了一下，有如下几种方法：
        文件显示法：可以以文件的形式显示！将你要显示的XML串存到本地文件里，并将WebBrowser的Url属性指向这个文件即可！这种方法简易，有效，但不一定实用，因为大部分时间我们要做的工作是将一个XML流显示出来。当然，我们可以将XML流存到一个临时文件里，之后再用第一种方法来显示这个XML串；但是，我们还有更好的方法，不用在本地生成临时文件！
        首先，看看IE是怎样显示XML串的。当我们用IE打开XML文件时，在IE里显示的是一个按XML文档格式缩进的，并可以折起和展开的XML字符串。其实IE只是用它内嵌的XSLT文件，将XML转成了我们看到的html代码。那么同理，我们也可以将我们要显示的XML字符串用XSLT转换成html代码，并赋给WebBrowser的DocumentText属性。如果你是XSLT高手，那么你可以自己写一段XSLT，之后用如下代码来完成工作：

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using System.Xml;
using System.Xml.Xsl;
using System.IO;

namespace WindowsApplication
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            string   xml = String.Empty;                                    //Xml字符串
            string   xslt = String.Empty;                                   //Xslt字符串

            XmlReader reader = null;                                        //要转换的Xml
            MemoryStream readerstream = new MemoryStream();                 //要转换的Xml流

            XmlWriter writer = null;                                        //转换后的字符串
            MemoryStream writerstream = new MemoryStream();                 //转换后的字符串流  
                       
            XslCompiledTransform trans = new XslCompiledTransform();        //Xslt对象        System.Xml.Xsl命名空间下

            MemoryStream stream = new MemoryStream();                       //Xslt流    
            XmlReader xsltreader = null;

            string returnValue = String.Empty;                              //转换后的html代码  
            
            byte[] byteArray = Encoding.UTF8.GetBytes(xslt);

            try
            {
                //取得Xslt流    
                stream.Write(byteArray, 0, byteArray.Length);
                xsltreader = XmlReader.Create(stream);



                //取得要转换的Xml流
                byte[] byteXml = Encoding.UTF8.GetBytes(xml);
                readerstream.Write(byteXml,0,byteXml.Length);
                reader = XmlReader.Create(readerstream);


                //取得转换后的字符串流
                writer = XmlWriter.Create(writerstream);

                trans.Load(xsltreader);

                trans.Transform(reader, writer);


                writerstream.Position = 0;
                returnValue = new StreamReader(writerstream).ReadToEnd();

                this.webBrowser1.DocumentText = returnValue;                //将html代码赋给WebBrowser的DocumentText属性


            }
            finally
            {
                readerstream.Close();
                writerstream.Close();
                stream.Close();

                if (reader != null)
                {
                    reader.Close();
                }

                if (writer != null)
                {
                    writer.Close();
                }

                if (xsltreader != null)
                {
                    xsltreader.Close();
                }

            }

        }
    }
}

        如果很不幸，你跟我一样，对XSLT并不十分精通，也没有关系，你可以用Microsoft提供的defaultss.xsl文件，网上有很多文章介绍怎么得到这个文件。不过，如果你使用defaultss.xsl这个文件的话，就不能再用以上方法了，因为XslCompiledTransform类的Load方法，只能读取符合xslt 1.0标准的XSLT文件，但defualtss.xsl并不完全符合这个标准。那么，这时，我们可以采用另外一种方法，那就是引用COM！你可以引Microsoft XML 3.0 Parser（如果你本机安装了的话），并使用如下方法完成工作：

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using System.Xml;
using System.Xml.Xsl;
using System.IO;

namespace WindowsApplication
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            MSXML2.DOMDocument30Class xml = new MSXML2.DOMDocument30Class();        //Xml对象
            MSXML2.DOMDocument30Class xslt = new MSXML2.DOMDocument30Class();       //Xslt对象    

            xml.loadXML("");                                                        //读取Xml字符串
            xslt.loadXML("");                                                       //读取Xslt字符串

            this.webBrowser1.DocumentText = xml.transformNode(xslt);                //将转换的html字符串赋给WebBrowser控件
        }
    }
}

        如果你不想有临时文件，也不想引用COM的话，那么还有如下方法可供选择，呵呵!
        正如前边所说，WebBrowser就像个IE，那么既然是IE，就会支持javascript，那么我们可以以客户端调用的方式来实现Xml文件的转换

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <STYLE>
          BODY{font:x-small 'Verdana';margin-right:1.5em}
          .c{cursor:hand}
          .b{color:red;font-family:'Courier New';font-weight:bold;text-decoration:none}
          .e{margin-left:1em;text-indent:-1em;margin-right:1em}
          .k{margin-left:1em;text-indent:-1em;margin-right:1em}
          .t{color:#990000}
          .xt{color:#990099}
          .ns{color:red}
          .dt{color:green}
          .m{color:blue}
          .tx{font-weight:bold}
          .db{text-indent:0px;margin-left:1em;margin-top:0px;margin-bottom:0px;padding-left:.3em;border-left:1px solid #CCCCCC;font:small Courier}
          .di{font:small Courier}
          .d{color:blue}
          .pi{color:blue}
          .cb{text-indent:0px;margin-left:1em;margin-top:0px;margin-bottom:0px;padding-left:.3em;font:small Courier;color:#888888}
          .ci{font:small Courier;color:#888888}
          PRE{margin:0px;display:inline}
        </STYLE>
        <SCRIPT>
            function f(e){
            if (e.className=="ci"){if (e.children(0).innerText.indexOf("\n")>0) fix(e,"cb");}
            if (e.className=="di"){if (e.children(0).innerText.indexOf("\n")>0) fix(e,"db");}
            e.id="";
            }
            function fix(e,cl){
            e.className=cl;
            e.style.display="block";
            j=e.parentElement.children(0);
            j.className="c";
            k=j.children(0);
            k.style.visibility="visible";
            k.href="#";
            }
            function ch(e){
            mark=e.children(0).children(0);
            if (mark.innerText=="+"){
            mark.innerText="-";
            for (var i=1;i<e.children.length;i++)
            e.children(i).style.display="block";
            }
            else if (mark.innerText=="-"){
            mark.innerText="+";
            for (var i=1;i<e.children.length;i++)
            e.children(i).style.display="none";
            }}
            function ch2(e){
            mark=e.children(0).children(0);
            contents=e.children(1);
            if (mark.innerText=="+"){
            mark.innerText="-";
            if (contents.className=="db"||contents.className=="cb")
            contents.style.display="block";
            else contents.style.display="inline";
            }
            else if (mark.innerText=="-"){
            mark.innerText="+";
            contents.style.display="none";
            }}
            function cl(){
            e=window.event.srcElement;
            if (e.className!="c"){e=e.parentElement;if (e.className!="c"){return;}}
            e=e.parentElement;
            if (e.className=="e") ch(e);
            if (e.className=="k") ch2(e);
            }
            function ex(){}
            function h(){window.status=" ";}
            document.onclick=cl;
          </SCRIPT>
         <script language="javascript">
            function showXML()
            {
                var xml = null;             //xml 对象
                var xsl = null;             //xsl 对象
                var xslstring = null;       //xslt 字符串
                
                xml = new ActiveXObject("Microsoft.XMLDOM");
                xml.loadXML("@@XML");                               //读取XML字符串
                          
                xslstring = "<?xml version=\"1.0\"?><x:stylesheet xmlns:x=\"http://www.w3.org/TR/WD-xsl\" xmlns:dt=\"urn:schemas-microsoft-com:datatypes\" xmlns:d2=\"uuid:C2F41010-65B3-11d1-A29F-00AA00C14882\"><x:template match=\"/\"><DIV class=\"st\"><x:apply-templates/></DIV></x:template><x:template match=\"node()[nodeType()=10]\"><DIV class=\"e\"><SPAN><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"d\"><!DOCTYPE <x:node-name/><I> (View Source for full doctype)</I>></SPAN></SPAN></DIV></x:template><x:template match=\"pi()\"><DIV class=\"e\"><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"><?</SPAN><SPAN class=\"pi\"><x:node-name/><x:value-of/></SPAN><SPAN class=\"m\">?></SPAN></DIV></x:template><x:template match=\"pi('xml')\"><DIV class=\"e\"><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"><?</SPAN><SPAN class=\"pi\"> xml <x:for-each select=\"@*\"> <x:node-name/>=\"<x:value-of/>\"</x:for-each></SPAN><SPAN class=\"m\">?></SPAN></DIV></x:template><x:template match=\"@*\" xml:space=\"preserve\"><SPAN><x:attribute name=\"class\"><x:if match=\"x:*/@*\">x</x:if>t</x:attribute> <x:node-name/></SPAN><SPAN class=\"m\">=\"</SPAN><B><x:value-of/></B><SPAN class=\"m\">\"</SPAN></x:template><x:template match=\"@xmlns:*|@xmlns|@xml:*\"><SPAN class=\"ns\"> <x:node-name/></SPAN><SPAN class=\"m\">=\"</SPAN><B class=\"ns\"><x:value-of/></B><SPAN class=\"m\">\"</SPAN></x:template><x:template match=\"@dt:*|@d2:*\"><SPAN class=\"dt\"><x:node-name/></SPAN><SPAN class=\"m\">=\"</SPAN><B class=\"dt\"><x:value-of/></B><SPAN class=\"m\">\"</SPAN></x:template><x:template match=\"textnode()\"><DIV class=\"e\"><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"tx\"><x:value-of/></SPAN></DIV></x:template><x:template match=\"comment()\"><DIV class=\"k\"><SPAN><A class=\"b\" onclick=\"return false\" onfocus=\"h()\" STYLE=\"visibility:hidden\">-</A><SPAN class=\"m\"><!--</SPAN></SPAN><SPAN id=\"clean\" class=\"ci\"><PRE><x:value-of/></PRE></SPAN><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\">--></SPAN></DIV></x:template><x:template match=\"cdata()\"><DIV class=\"k\"><SPAN><A class=\"b\" onclick=\"return false\" onfocus=\"h()\" STYLE=\"visibility:hidden\">-</A><SPAN class=\"m\"><![CDATA[</SPAN></SPAN><SPAN id=\"clean\" class=\"di\"><PRE><x:value-of/></PRE></SPAN><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\">]]></SPAN></DIV></x:template><x:template match=\"*\"><DIV class=\"e\"><DIV STYLE=\"margin-left:1em;text-indent:-2em\"><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"><</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><x:apply-templates select=\"@*\"/><SPAN class=\"m\"> /></SPAN></DIV></DIV></x:template><x:template match=\"*[node()]\"><DIV class=\"e\"><DIV class=\"c\"><A href=\"#\" onclick=\"return false\" onfocus=\"h()\" class=\"b\">-</A><SPAN class=\"m\"><</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><x:apply-templates select=\"@*\"/><SPAN class=\"m\">></SPAN></DIV><DIV><x:apply-templates/><DIV><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"></</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><SPAN class=\"m\">></SPAN></DIV></DIV></DIV></x:template><x:template match=\"*[textnode()$and$$not$(comment()$or$pi()$or$cdata())]\"><DIV class=\"e\"><DIV STYLE=\"margin-left:1em;text-indent:-2em\"><SPAN class=\"b\">          <x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"><</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><x:apply-templates select=\"@*\"/><SPAN class=\"m\">></SPAN><SPAN class=\"tx\"><x:value-of/></SPAN><SPAN class=\"m\"></</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><SPAN class=\"m\">></SPAN></DIV></DIV></x:template><x:template match=\"*[*]\"><DIV class=\"e\"><DIV class=\"c\" STYLE=\"margin-left:1em;text-indent:-2em\"><A href=\"#\" onclick=\"return false\" onfocus=\"h()\" class=\"b\">-</A><SPAN class=\"m\"><</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><x:apply-templates select=\"@*\"/><SPAN class=\"m\">></SPAN></DIV><DIV><x:apply-templates/><DIV><SPAN class=\"b\"><x:entity-ref name=\"nbsp\"/></SPAN><SPAN class=\"m\"></</SPAN><SPAN><x:attribute name=\"class\"><x:if match=\"x:*\">x</x:if>t</x:attribute><x:node-name/></SPAN><SPAN class=\"m\">></SPAN></DIV></DIV></DIV></x:template></x:stylesheet>";
                            
                xsl = new ActiveXObject("Microsoft.XMLDOM");       
                xsl.loadXML(xslstring);                               //读取XSL字符串     
                
                document.all("xml").innerHTML = xml.transformNode(xsl);
                
            }
        </script>
    </head>
    <body onload="showXML();">
        <div id="xml"></div>    
    </body>
</html>

        这段html文件其实是一个模板，你可以把它存在Resource文件里，之后在向WebBrowser的DocumentText属性赋值之前，将模板里的@@XML用你实际想显示的XML串替换一下，同时没忘了将这个XML串里的"替成\"！

        又写完了一篇心得，希望能对大家有所帮助