xml學習(3) html顯示xml


有的時候我們需要在html顯示xml,比如我們修改了xml,點擊保存,需要在頁面顯示xml源碼,讓我們知道xml已經修改了,最好的方法是把xml放到pre元素中,但是會發現沒有換行,全部顯示一行,肯定很難看,所以我做了一個迭代xmlDOM的函數來格式顯示xml的函數,

  迭代函數思路:

1.每個xml文件時有無數個兄弟節點組成,但是終有最後截止的一個,那麼循環結束的標誌就是當一個節點沒有兄弟節點時,循環就結束,

那麼可以循環兄弟節點,於是有循環兄弟節點函數

2每個節點可能有子節點,子節點也可能有兄弟子節點,這個時候利用循環兄弟節點函數,循環節點的第一個子節點,

效果圖:

主要代碼:

   private void getXMLStr(XmlDocument xmlDoc)
    {
        foreach (XmlNode node in xmlDoc.ChildNodes)
        {

            if (node.NodeType == XmlNodeType.Element)
            {
                getNext(node,0);
            }
            else 
            {
                xml = "<div>" + node.OuterXml.Replace("<","<").Replace(">",">");
            }


        }
    }


    private void getNext(XmlNode node,int i)
    {
        if (node.NextSibling == null)//如果沒有兄弟節點
        {
            if (node.HasChildNodes)
            {
                //如果有子節點
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {
                    //getXmlAttribute(node)  獲取節點的所有屬性
                    //如果子節點的子節點不是text類型
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name +"  "+ getXmlAttribute(node) + "></div>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name +"></div>";
                }
                else
                {
                    //如果子節點的子節點不是text類型
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
 
                }
            }
            else  
            {
                xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
            }
        }
        else
        {
            if (node.HasChildNodes)
            {
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {

                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name+"  " + getXmlAttribute(node) + "></div>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name  + "></div>";
                }
                else
                {
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
                }
            }
            else
            {
                xml = xml + "<div " + "style='margin-left:" + (i*20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
            }
            getNext(node.NextSibling,i);

        }

    }


    private string  getXmlAttribute(XmlNode node)
    {
        string rtn=string.Empty;
        foreach (XmlAttribute attr in node.Attributes)
        {
            rtn +="  "+ attr.Name + "=" + attr.Value;
        }
        return rtn;
    }

  源碼:

showXML.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="showXML.aspx.cs" Inherits="showXML" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>讀取xml</title>
  
    <link rel="Stylesheet" type="text/css" href="Css/Common/InputStyle.css" />
    <script type="text/javascript"  src="Scripts/jquery-1.4.1.min.js"></script>
    <script type="text/javascript">
        function showXml() {
            $.ajax({
                url: 'showXML.aspx?action=create&rnd' + Math.random(),
                type: 'post',
                cache: false,
                async: false,
                success: function (result) {
                    if (result != '') {
                        result = result.toString();
                        $("#pre_xml").show().html('').append(result);
                    }
                    else {
                        alert('讀取數據失敗!');
                    }
                }
            });
        }

        $(document).ready(function () {
            showXml();
        });



        function hideXml() {
            $("#pre_xml").hide();
        }
    </script>


   

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div class="main">
      <div class="button">
        <table width="100%">
          <tr>
            <td>
              <input type="button" id="btn_show" class="two-bu" οnclick="showXml();" value="顯示"/>
               <input type="button" id="btn_hide" class="two-bu" οnclick="hideXml();" value="隱藏"/>
            </td>
          </tr>
        </table>
      </div>
      <div >
       <pre id="pre_xml"  style=" background-color:#A8B7CC; width:500px;"  ></pre>
      </div>
      

     </div>
    
    </div>
    
    </form>
</body>
</html>



showXML.aspx.cs


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Xml;
using System.Web.UI.HtmlControls;

public partial class showXML : System.Web.UI.Page
{

    public  string xml = string.Empty;
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
        }
        if (Request.QueryString["action"] != null && Request.QueryString["action"].ToString() != "")
        {
            switch (Request.QueryString["action"].ToString())
            {
                case "create":
                    Response.Clear();
                    Response.Write(showXml());
                    Response.End();
                    break;
                default:
                    break;

            }
        }


    }


    /// <summary>
    /// 在html顯示xml
    /// </summary>
    /// <param name="fileName">文件名字</param>
    private string showXml()
    {
        string rtn = string.Empty;
        string path = Server.MapPath("Xml\\") + "示例_創建" + ".xml"; //xml文件路徑
        if (File.Exists(path))
        {
            XmlTextReader xmlRead = new XmlTextReader(path);//xml只讀類
            XmlDocument xmlDoc = new XmlDocument();
            xmlDoc.Load(xmlRead);

            xmlRead.Close();
            getXMLStr(xmlDoc);
            rtn = xml;
        }
        return rtn;

    }


    private void getXMLStr(XmlDocument xmlDoc)
    {
        foreach (XmlNode node in xmlDoc.ChildNodes)
        {

            if (node.NodeType == XmlNodeType.Element)
            {
                getNext(node,0);
            }
            else 
            {
                xml = "<div>" + node.OuterXml.Replace("<","<").Replace(">",">");
            }


        }
    }


    private void getNext(XmlNode node,int i)
    {
        if (node.NextSibling == null)//如果沒有兄弟節點
        {
            if (node.HasChildNodes)
            {
                //如果有子節點
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {
                    //getXmlAttribute(node)  獲取節點的所有屬性
                    //如果子節點的子節點不是text類型
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name +"  "+ getXmlAttribute(node) + "></div>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name +"></div>";
                }
                else
                {
                    //如果子節點的子節點不是text類型
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
 
                }
            }
            else  
            {
                xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
            }
        }
        else
        {
            if (node.HasChildNodes)
            {
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {

                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name+"  " + getXmlAttribute(node) + "></div>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name  + "></div>";
                }
                else
                {
                    xml = xml + "<div " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
                }
            }
            else
            {
                xml = xml + "<div " + "style='margin-left:" + (i*20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</div>";
            }
            getNext(node.NextSibling,i);

        }

    }


    private string  getXmlAttribute(XmlNode node)
    {
        string rtn=string.Empty;
        foreach (XmlAttribute attr in node.Attributes)
        {
            rtn +="  "+ attr.Name + "=" + attr.Value;
        }
        return rtn;
    }

}




示例_創建.xml源碼

注意:xml路徑與後天獲取的xml的路徑要一致,我的路徑是程序根目錄xml文件夾下

示例_創建.xml源碼


<?xml version="1.0" encoding="utf-8" ?>
<catalog  name="測試" >
    <cd >
        <title>11</title>
        <artist>12</artist>
        <country>13</country>
        <company>14</company>
        <price>15</price>
        <year>16</year>
    </cd>
    <cd>
        <title>21</title>
        <artist>22</artist>
        <country>23</country>
        <company>24</company>
        <price>25</price>
        <year>26</year>
    </cd>
  
  </catalog>








  

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章