用xml數據填充下拉菜單的函數？ Javascript + XML

我有這個任務我想完成上課，我有一些困難得到這個功能的工作，並希望得到一些如何做到這一點的見解。 HTML頁面由一個帶有讀取「獲取XML數據」按鈕的表單組成。點擊該按鈕後，xml文件將使用XML httprequest（全部爲本地）讀取。這個XML文件包含3個不同城市的天氣數據。用xml數據填充下拉菜單的函數？ Javascript + XML

<stationdata weatherdate="2015-12-30" location="Calgary"> 
    <maxtemp>-2.7</maxtemp> 
    <mintemp>-18.2</mintemp> 
    <totalrain>0</totalrain> 
    <totalsnow>0</totalsnow> 
</stationdata>'

它看起來像一年中的每一天爲3個不同的城市。我試圖讓我的程序讀取城市，並生成三個城市名稱（卡爾加里，夏洛特敦，渥太華）的下拉菜單。到目前爲止，出於某種原因，我只能閱讀一個城市。

任何幫助，將不勝感激。

這是我到目前爲止有：

function getDoc() { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
     if (xhttp.readyState == 4 && xhttp.status == 200) { 
     alert("XML file obtained"); 
     myFunction(xhttp); 
     //var data = xhttp.responseXML; 
     } 
    }; 
    xhttp.open("GET", "weatherdata.xml", true); 
    xhttp.send(); 

    function myFunction(xml) { 
    var xmlDoc = xml.responseXML; 
    var i = 0; 
    var x = xmlDoc.getElementsByTagName("stationdata")[i]; 
    var txt = x.getAttribute("location"); 
    document.getElementById("generatedDataDiv").innerHTML = txt; 

    var len = xmlDoc.documentElement.childNodes; 

    for (i = 0; i < len.length; i++) { 
     document.getElementById("generatedDataDiv").innerHTML = txt; 
     //i++; 
    } 

    } 

}

我相信我需要循環不知何故，但我沒能看到。 XML文件包含這些數據的6000行，我只需要能夠從文件中獲取位置，然後消除任何重複，這應該給我3個城市名稱。到目前爲止，我只得到一個。

來源

2016-03-26 Jacob Noble

document.getElementById("generatedDataDiv").innerHTML = txt;

我從來沒有在JavaScript中處理過XML，但很明顯你會在每個循環中覆蓋innerHTML。

你或許應該在顯示之前先消除重複它，例如：

var uniqueArray = []; 
len.forEach(function(element, index, array){ 
    if(uniqueArray.indexOf(element) === -1){ 
    uniqueArray.push(element); 
}}); 
//uniqueArray should now contain your three cities.

然後，然後做一個簡單的循環來填充下拉列表。

來源

2016-03-26 04:34:21

謝謝！我發現這工作。 –

用xml數據填充下拉菜單的函數？ Javascript + XML

回答

相關問題