像XML文件一樣解析kml文件

Question

我正在嘗試解析我的kml文件以獲取地標的位置，並向這些位置添加html鏈接，以便在單擊地圖時將其平移到用戶單擊的位置。 但是，使用我現在的代碼，它將無法正確解析文件，並給我這個錯誤

Uncaught NotFoundError: Failed to execute 'appendChild' on 'Node': The new child element is null.

我認為這個錯誤是因為當解析器要添加位置鏈接時解析器返回了一個空值。 我很確定自己可以正確執行通話，但是仍然不確定為什么會彈出此錯誤，有人可以幫忙嗎？

    var map = null;
var KMLLayer = null;
var KMLayer2 = null;
var item = "";
var nav = [];
$(document).ready(function(){
    //initialise a map
    initialize();
$.get("/img/Keenelandlayer2.kml", function(data){
        var html = "";
        //loop through placemarks tags
        $(data).find("Placemark").each(function(index, value){
            //get coordinates and place name
            coords = $(this).find("coordinates").text();
            place = $(this).find("name").text();
            test = "test";
            //store as JSON
            c = coords.split(",")
            nav.push({
                "place": place,
                "lat": c[0],
                "lng": c[1]
            });
            //output as a navigation
            html += "<li>" + place + test + "</li>";
            item = "<li>" + place + test + "</li>";
            document.getElementById("list").appendChild(item);
        })
        //output as a navigation
        $(".navigation").append(html);
        //bind clicks on your navigation to scroll to a placemark
        $(".navigation li").bind("click", function(){
            panToPoint = new google.maps.LatLng(nav[$(this).index()].lng, nav[$(this).index()].lat);
            map.panTo(panToPoint);
        });
    });
}); 
function initialize() {
var mapOptions = {
  center: new google.maps.LatLng( 38.04798015658998, -84.59683381523666),
  zoom: 16,
  disableDefaultUI: true,
  zoomControl: true,
  mapTypeId: google.maps.MapTypeId.SATELLITE
};
var kmlOptions = {
suppressInfoWindows: true,
preserveViewport: false,
map: map
};
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
    KMLLayer = new google.maps.KmlLayer({url: 'https://sites.google.com/site/cs499fbt/files/Keenelandlayer1.kml'}, kmlOptions);
    KMLLayer2 = new google.maps.KmlLayer({url:'https://sites.google.com/site/cs499fbt/files/Keenelandlayer2.kml'},kmlOptions);

    KMLLayer.setMap(map);
    google.maps.event.addListener(map, "zoom_changed",function() {
        //below is the line that prevents the labels to appear, needs to be there to allow the second kml layer to be displayed
        event.preventDefault();
        if (!!map){
            var zoom = map.getZoom();
            if (zoom < 16){
                if (!!KMLLayer2.getMap()) KMLLayer2.setMap(null);
                if (!KMLLayer.getMap()) KMLLayer.setMap(map);
            }
            else{
                if (!KMLLayer2.getMap()) KMLLayer2.setMap(map);
                if (!!KMLLayer.getMap()) KMLLayer.setMap(null);
            }
        }
    });
    }
    google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

item不是節點，它只是一個字符串，不能用作appendChild參數。

創建一個節點：

item = document.createElement('li');
item.appendChild(document.createTextNode(place + test));
document.getElementById("list").appendChild(item);

或使用jQuery（就像稍后再做幾行一樣）：

$('#list').append($("<li>" + place + test + "</li>"));