参考 http://www.w3school.com.cn/xmldom/dom_document.asp

A.xml

<?xml version="1.0" encoding="utf-8"?>

<root>

 <data id="1">

 <lon>114.065995</lon>

 <lat>22.66754</lat>

 <name>站点1</name>

 </data>

 <data id="2">

 <lon>114.060010</lon>

 <lat>22.66754</lat>

 <name>站点2</name>

 </data>

 <data id="3">

 <lon>114.060020</lon>

 <lat>22.66754</lat>

 <name>站点3</name>

 </data>

 <data id="4">

 <lon>114.060030</lon>

 <lat>22.66754</lat>

 <name>站点4</name>

 </data>

 <data id="5">

 <lon>114.060040</lon>

 <lat>22.66754</lat>

 <name>站点5</name>

 </data>

</root>

2、读取数据

// 生成XML对象

function loadXMLDom(fileName)

{

     if (window.XMLHttpRequest)

    {

        xhttp=new XMLHttpRequest();

    }

    else

    {

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

    }

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

    xhttp.send();

    return xhttp.responseXML;

}

function stationDatas(fileName)

{

   var xmlDom=loadXMLDom(fileName);

   //获得根节点

   var root=xmlDom.documentElement;

   var data="";

   var names=root.getElementsByTagName("name");

   var lons=root.getElementsByTagName("lon");

   var lats=root.getElementsByTagName("lat");

   var len=names.length;

   for(var i=0;i<len;i++)

   {

     data +="name";

     data += names[i].firstChild.nodeValue;

     data += "lon";

     data += lons[i].firstChild.nodeValue;

   }

   return data;

}

3、html 引用

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<script type="text/javascript" src="js/mytrans.js"></script>

<body>

    <h1>我的第一个标题</h1>

    <p>我的第一个段落。</p>

</body>

<script type="text/javascript">

document.write(stationDatas("A.xml"));

</script>

</html>

4、结果

js 读xml文件的更多相关文章

  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文件和XML字符串

    JS解析XML文件 <script type='text/javascript'> loadXML = function(xmlFile){ var xmlDoc=null; //判断浏览 ...

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

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

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

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

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

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

  6. LinqToXML~读XML文件

    linq的出现,带给我们的是简结,快速,可读性,它由linq to sql,linq to object,linq to XML组成,我的博客之前有对linq to sql的讲解,而今天,我将讲一个l ...

  7. 用js解析XML文件，字符串一些心得

    解析XML文件遇到的问题 今天秦博士叫我解析一下XML文件,将里面的所有的X坐标Y坐标放在一个数组里面然后写在文档里让他进行算法比对,大家都知道了啦,解析XML文件获取里面的坐标数据什么的,当然是用前 ...

  8. js 读取xml文件

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

  9. js 对XML文件的保存与读取

    一.保存(在前端用js创建xml格式) function exportToXml(jsonStr){ var obj = eval('('+ jsonStr + ')'); var xmlDoc = ...

随机推荐

  1. typescript 入门教程三

    类型别名 下面的代码将string类型赋值给一个别名,以后如果出现别名的地方,就好比出现类型string,同理其他类型也一样 type Name=string let gender:Name='男' ...

  2. ifconfig介绍

    [root@controller01 ~]# ip addr 1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNK ...

  3. PMBOK项目管理的五大过程组和十大知识领域

    PMBOK五大过程组是:启动过程.规划过程.执行过程.监控过程.收尾过程. 各用一句话概括项目管理知识体系五大过程组: 1.启动过程组:作用是设定项目目标,让项目团队有事可做: 2.规划过程组:作用是 ...

  4. python之基础总结（飞机大战）

    一.学习python有一段时间了,总体上手还是挺好的,但是有些东西还是和Java存在着一定的区别,这里主要是通过学习,然后自己去编写一个案例.从中学习到的一些东西,这里分享出来,如果存在不正确的地方还 ...

  5. C#-Parallel

    using System; using System.Collections.Concurrent; using System.Collections.Generic; using System.Li ...

  6. Atcoder&CodeForces杂题11.7

    Preface 又自己开了场CF/Atcoder杂题,比昨天的稍难,题目也更有趣了 昨晚炉石检验血统果然是非洲人... 希望这是给NOIP2018续点rp吧 A.CF1068C-Colored Roo ...

  7. ol li 兼容

    ol 标签在 chrome 60 和 safari12 缩进不一样. 因为序号距离copy距离不一样,导致显示不一样.解决办法. list-style-position: inside;text-in ...

  8. H5 新增标签canvas 画布

    canvas是写在body中的标签,设置宽高后,通过JS来往其中绘制想要的内容, canvas可以理解为一个画板,而JS就是你的画笔. 1.获取到画布 var canvas = document.ge ...

  9. 本地数据存储解决方案以及cookie的坑

    本地数据存储解决方案以及cookie的坑 问题: cookie过长导致页面打开失败 背景: 在公司的项目中有一个需求是打开多个工单即在同一个页面中打开了多个tab(iframe),但是需要在刷新时只刷 ...

  10. Nginx 安装目录 和 编译参数

    安装目录详解 查看安装nginx之后总共生成了哪些文件 rpm -ql nginx 在上面的文件中包括配置文件和日志文件 /etc/logrotate.d/nginx 类型:配置文件 作用:Nginx ...