0

我无法使用 getElementsByTagName 从 xml 文件中获取数据。我应该使用什么？

这是 XML：

<?xml version="1.0" encoding="UTF-8"?>
<markers>
    <marker>
        <lat>37.427770</lat> 
        <lng>-122.144841</lng>
        <name>Jackie</name>
    </marker>
    <marker>
        <lat>37.413320</lat> 
        <lng>-122.125604</lng>
        <name>Peter</name>
    </marker>
</markers>

整个 HTML 文件：

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Common Loader</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
  </script>
 <script type="text/javascript" src="util.js"></script>
<script type="text/javascript">
var infowindow;
var map;

function initialize() {
var myLatlng = new google.maps.LatLng(37.4419, -122.1419);
var myOptions = {
  zoom: 13,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
downloadUrl("moredata.xml", function(data) {
  var markers = data.documentElement.getElementsByTagName("marker");
  for (var i = 0; i < markers.length; i++) {
    var latlng = new 
google.maps.LatLng(parseFloat(markers[i].getElementsByTagName("lat")),
                                parseFloat(markers[i].getElementsByTagName("lng")));
    var marker = createMarker(markers[i].getElementsByTagName("name"), latlng);
   }
 });
}

 function createMarker(name, latlng) {
 var marker = new google.maps.Marker({position: latlng, map: map});
 google.maps.event.addListener(marker, "click", function() {
  if (infowindow) infowindow.close();
  infowindow = new google.maps.InfoWindow({content: name});
  infowindow.open(map, marker);
});
return marker;
}

</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:400px; height:300px"></div>
</body>
</html>

该文件是http://gmaps-samples-v3.googlecode.com/svn/trunk/xmlparsing/downloadurl_info.html的编辑版本

我试图在不使用属性的情况下获取数据

4

2 回答 2

0

我认为问题在于，

var markers = data.documentElement.getElementsByTagName("marker");

尝试将其更改为，

var markers = data.getElementsByTagName("marker");
于 2013-03-28T18:33:24.590 回答
0

首先，var markers = data.documentElement.getElementsByTagName("marker");将导致一个空节点列表，因为您<marker>的 XML 中绝对没有元素。

接下来，parseFloat(markers[i].getElementsByTagName("lat")也不会工作。假设markers[i]将是元素<title>，getElementsByTagName则将返回元素的NodeList<lat> - 这是您可能无法做到的parseFloat！

相反，您需要从列表中获取第一个元素，访问其第一个TextNode并从中获取nodeValue- 或者至少以某种方式textContent从您的<lat>.

然后，回调函数看起来像

function(data) {
    var markers = data.documentElement.getElementsByTagName("title"); // or "marker", after you've changed it
    console.log(markers);
    for (var i=0; i<markers.length; i++) {
        var lats = markers[i].getElementsByTagName("lat"),
            lngs = markers[i].getElementsByTagName("lng"),
            names = markers[i].getElementsByTagName("name");
        if (lats.length && lngs.length) {
            console.log("contents:", lats[0].textContent, lats[0].textContent);
            var lat = parseFloat(lats[0].textContent),
                lng = parseFloat(lats[0].textContent);
        } else console.log("didn't found <lat>/<lng>");
        if (!isNaN(lat) && !isNaN(lng) && names.length) {
            var name = names[0].textContent,
                latlng = new google.maps.LatLng(lat, lng),
                marker = createMarker(name, latlng);
                console.log("created marker", name, marker);
        }
    }
}
于 2013-03-27T13:59:24.503 回答