参考 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、结果

 

posted on 2018-07-18 14:18  卡贝天师  阅读(191)  评论(0编辑  收藏  举报