先看xml文件：

<?xml version="1.0" standalone="yes"?>

<student>

  <stuinfo>

    <stuName>张秋丽</stuName>

    <stuSex>女   </stuSex>

    <stuAge>18</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>李文才</stuName>

    <stuSex>男   </stuSex>

    <stuAge>31</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>李斯文</stuName>

    <stuSex>男   </stuSex>

    <stuAge>22</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>马英</stuName>

    <stuSex>女   </stuSex>

    <stuAge>25</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>孙红雷</stuName>

    <stuSex>男   </stuSex>

    <stuAge>32</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>欧阳俊雄</stuName>

    <stuSex>男   </stuSex>

    <stuAge>28</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>江琳</stuName>

    <stuSex>女   </stuSex>

    <stuAge>23</stuAge>

  </stuinfo>

  <stuinfo>

    <stuName>小小</stuName>

    <stuSex>女   </stuSex>

    <stuAge>22</stuAge>

  </stuinfo>

</student>

aspx页面代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="获取数据库数据生成XML.aspx.cs" Inherits="Chapter1.获取数据库数据生成XML" %>

<!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 runat="server">

    <title></title>

    <script type="text/javascript">

        function loadXMLDoc(dname) {

            if (window.XMLHttpRequest) {

                xhttp = new XMLHttpRequest();

            }

            else {

                xhttp = new ActiveXObject("Microsoft.XMLHTTP");

            }

            xhttp.open("GET", dname, false);

            xhttp.send("");

            return xhttp.responseXML;

        }

        function ReadXml() {

            var xmldoc = loadXMLDoc("Student.xml");

            //获得指定节点

            var divmsg = document.getElementById("xmlMsg");

            var msg = "<table border='1' id='mytable'><tr><th>姓名</th><th>性别</th><th>年龄</th><tr>";

            var nodes = xmldoc.getElementsByTagName("stuinfo");

            for (var i = ; i < nodes.length; i++) {

                msg += "<tr>";

                msg += "<td>" + nodes[i].getElementsByTagName("stuName")[].firstChild.nodeValue + "</td>";

                msg += "<td>" + nodes[i].getElementsByTagName("stuSex")[].firstChild.nodeValue + "</td>";

                msg += "<td>" + nodes[i].getElementsByTagName("stuAge")[].firstChild.nodeValue + "</td>";

                msg += "</tr>";

            }

            msg += "</table>";

            divmsg.innerHTML = msg;

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <input type="button" value="JS读取XML" onclick="ReadXml()" /><br />

        <div id="xmlMsg">

        </div>

    </div>

    </form>

</body>

</html>

上面的JS操作主要就避免了使用childNodes(因为火狐中有时候会出现childNodes[0]获取到的是"\n"而不是我们想要的第一个子节点，这个自己可以去试下，反正我是遇到了这种情况),使得可以兼容IE、火狐，其他浏览器我没试。

JS读取XML文件数据并以table显示数据(兼容IE火狐)的更多相关文章

  1. jQuery、JS读取xml文件里的内容（JS先通过document.implementation.createDocument方法将xml转换成document对象，jQuery将读取到的xml转成table）

    xml文件:test.xml <?xml version="1.0"?> <note> <to>George</to> <fr ...

  2. Js读取XML文件为List结构

    习惯了C#的List集合,对于Javascript没有list 极为不舒服,在一个利用Js读取XML文件的Demo中,决定自己构建List对象,将数据存入List. 第一步,Js读取XML文件知识 X ...

  3. IE下JS读取xml文件示例代码

    JS读取xml文件具体步骤为:创建DOM对象.加载xml文件(仅适用于IE)附示例代码,感兴趣的朋友可以参考下,希望对大家有所帮助使用javascript脚本读取xml文件,这里暂只考虑IE浏览器st ...

  4. js 读取xml文件

    读取xml文件 [原创 2007-6-20 17:35:37]     字号:大 中 小 js中读取xml文件,简单的例子: <html><head><script> ...

  5. js读取xml文件

    假设我们现在要读取下面的 info.xml 文件 <?xml version="1.0" encoding="gb2312"?> <root& ...

  6. 【JavaScript】JS读取XML文件并进行搜索

    需求效果 点击链接.当前页面载入xml文件并展示相应内容 通过搜索框.搜索xml文件内节点数据.展示包括内容的节点数据 功能实现 Demo终于实现效果 http://loadxmldemo.coder ...

  7. [HTML]js读取XML文件并解析

    xml文件:test.xml <?xml version="1.0"?> <note> <to>George</to> <fr ...

  8. js操作XML文件兼容IE与FireFox

    最近项目中用到了xml,需求是用户安装产品时先把一系列的数据保存到xml文件中,当执行到最后一步时才写入数据库,这样最大限度的减少了数据库的访问,于是不得不纠结在各浏览器的兼容性的问题(悲哀啊.... ...

  9. 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie，Session，Application的用法与区别？ c#反射 抽象工厂

    浅谈JS中的!=.== .!==.===的用法和区别   var num = 1;     var str = '1';     var test = 1;     test == num  //tr ...

随机推荐

  1. Android 前台服务

    Android 前台服务 学习自 https://blog.csdn.net/guolin_blog/article/details/11952435#t3 前台服务漫谈 我们之前学习的Service ...

  2. Python基础笔记(三)

    1. 循环与流程控制 (1) for myList1 = ["A", "B", "C", "D"] # 正序遍历 for ...

  3. 详解django三种文件下载方式

    推荐使用FileResponse,从源码中可以看出FileResponse是StreamingHttpResponse的子类,内部使用迭代器进行数据流传输. 在实际的项目中很多时候需要用到下载功能,如 ...

  4. 解决Mac java.net Local host name unknown error的方法

    解决这个问题的方法: scutil --set HostName "localhost"  解决Mac java.net Local host name unknown error ...

  5. CTSC被虐记

    退役前写写破事乐呵乐呵..(雾 Day0 愉快的没有分到另一个宾馆...但是是个单间...而且居然是大床房...难以置信, 试机向BeiYe学习了一发Gedit的外部工具, 试到一般好像都走了..只剩 ...

  6. Western Subregional of NEERC, Minsk, Wednesday, November 4, 2015 Problem H. Parallel Worlds 计算几何

    Problem H. Parallel Worlds 题目连接: http://opentrains.snarknews.info/~ejudge/team.cgi?SID=c75360ed7f2c7 ...

  7. hdu 5761 Rower Bo 物理题

    Rower Bo 题目连接: http://acm.hdu.edu.cn/showproblem.php?pid=5761 Description There is a river on the Ca ...

  8. mysql分页查询优化(索引延迟关联)

    对于web后台报表导出是一种常见的功能点,实际对应服务后端即数据库的排序分页查询.如下示例为公司商户积分报表导出其中一个sql ,当大批量的导出请求进入时候,mysql的cpu急剧上升瞬间有拖垮库的风 ...

  9. 【 D3.js 入门系列 --- 9 】 常见可视化图形

    本人的个人博客为: www.ourd3js.com csdn博客为: blog.csdn.net/lzhlzz 转载请注明出处,谢谢. Layout ,直译为"布局,安排".但在 ...

  10. Revit API单位转换类

    用法:txt.Text=UnitConvertC.CovertFromAPI(param.AsDouble());param.Set(UnitConvertC.CovertToAPI(txt.Text ...