1. 首页
  2. 文章中心
  3. xml，html

xml学习（3） html显示xml

222 阅读 0 评论
我是靠谱客的博主 活泼八宝粥，这篇文章主要介绍xml学习（3） html显示xml，现在分享给大家，希望可以做个参考。

有的时候我们需要在html显示xml，比如我们修改了xml,点击保存，需要在页面显示xml源码，让我们知道xml已经修改了，最好的方法是把xml放到pre元素中，但是会发现没有换行，全部显示一行，肯定很难看，所以我做了一个迭代xmlDOM的函数来格式显示xml的函数，

迭代函数思路：

1.每个xml文件时有无数个兄弟节点组成，但是终有最后截止的一个，那么循环结束的标志就是当一个节点没有兄弟节点时，循环就结束，

那么可以循环兄弟节点，于是有循环兄弟节点函数

2每个节点可能有子节点，子节点也可能有兄弟子节点，这个时候利用循环兄弟节点函数，循环节点的第一个子节点，

效果图：

主要代码：

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
private void getXMLStr(XmlDocument xmlDoc)
    {
        foreach (XmlNode node in xmlDoc.ChildNodes)
        {

            if (node.NodeType == XmlNodeType.Element)
            {
                getNext(node,0);
            }
            else 
            {
                xml = "<p>" + 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 + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name +"  "+ getXmlAttribute(node) + "></p>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name +"></p>";
                }
                else
                {
                    //如果子节点的子节点不是text类型
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
 
                }
            }
            else  
            {
                xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
            }
        }
        else
        {
            if (node.HasChildNodes)
            {
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {

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

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<%@ 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">
    <p>
    <p class="main">
      <p class="button">
        <table width="100%">
          <tr>
            <td>
              <input type="button" id="btn_show" class="two-bu" onclick="showXml();" value="显示"/>
               <input type="button" id="btn_hide" class="two-bu" onclick="hideXml();" value="隐藏"/>
            </td>
          </tr>
        </table>
      </p>
      <p >
       <pre id="pre_xml"  style=" background-color:#A8B7CC; width:500px;"  ></pre>
      </p>
      

     </p>
    
    </p>
    
    </form>
</body>
</html>
登录后复制



showXML.aspx.cs


复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
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 = "<p>" + 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 + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name +"  "+ getXmlAttribute(node) + "></p>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name +"></p>";
                }
                else
                {
                    //如果子节点的子节点不是text类型
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
 
                }
            }
            else  
            {
                xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
            }
        }
        else
        {
            if (node.HasChildNodes)
            {
                if (node.FirstChild.NodeType != XmlNodeType.Text)
                {

                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ><" + node.Name+"  " + getXmlAttribute(node) + "></p>";
                    getNext(node.FirstChild, i + 1);
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  ></"+ node.Name  + "></p>";
                }
                else
                {
                    xml = xml + "<p " + "style='margin-left:" + (i * 20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
                }
            }
            else
            {
                xml = xml + "<p " + "style='margin-left:" + (i*20).ToString() + "px'  >" + node.OuterXml.Replace("<", "<").Replace(">", ">") + "</p>";
            }
            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源码


复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?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>
登录后复制



以上就是xml学习（3） html显示xml的内容，更多相关内容请关注靠谱客（www.uoften.com）！

最后

以上就是活泼八宝粥最近收集整理的关于xml学习（3） html显示xml的全部内容，更多相关xml学习（3）内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
点赞(147)

相关文章

Java&Xml教程（四）使用DOM方式生成XML文件
Java&Xml教程（四）使用DOM方式生成XML文件
xml学习（2）xml文档树结构图
xml学习（2）xml文档树结构图
疯狂XML学习笔记（9）-------------Schema内置类型
疯狂XML学习笔记（9）-------------Schema内置类型
Java&Xml教程（五）使用SAX方式解析XML文件
Java&Xml教程（五）使用SAX方式解析XML文件
xml学习（3） html显示xml
xml学习（3） html显示xml
Java&Xml教程（六）使用JDOM解析XML文件
Java&Xml教程（六）使用JDOM解析XML文件
xml学习（4） 创建xml 文件
xml学习（4） 创建xml 文件
xml学习（6） 在c#Xpath实例
xml学习（6） 在c#Xpath实例

评论列表共有 0 条评论

立即
投稿
返回
顶部