使用JavaScript顯示標記名內的所有節點

-1

我試圖使用loadXMLDoc（）JavaScript函數從XML文檔加載數據，並在單擊按鈕時將其顯示在我的頁面DIV上。到目前爲止，我無法在我的DIV中獲得任何內容，我想加載特定標記名中的所有元素。使用JavaScript顯示標記名內的所有節點

這裏的XML：

<?xml version="1.0" encoding="UTF-8"?> 
<Fruits> 
    <Cell>Apples</Cell> 
    <Cell>Bananas</Cell> 
    <Cell>Strawberries</Cell> 
</Fruits> 
<Vegetables> 
    <Cell>Lettuce</Cell> 
    <Cell>Tomatoes</Cell> 
    <Cell>Carrots</Cell> 
</Vegetables>

這裏的JavaScript的：

function fruits() 
{ 
    var 
    xmlhttp; 
    if (window.XMLHttpRequest) 

    {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function() 
    { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      xmlDoc = xmlhttp.responseXML; 
      document.getElementById("food").innerHTML=xmlDoc.getElementsByTagName("fruits"); 
     } 
     xmlhttp.open("GET","document.xml", true); 
     xmlhttp.send(); 
    } 

    function vegetables() 
    { 
     var 
     xmlhttp; 
     if (window.XMLHttpRequest) 

     {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      xmlDoc = xmlhttp.responseXML; 
      document.getElementById("food").innerHTML=xmlDoc.getElementsByTagName("vegetables"); 
     } 
     xmlhttp.open("GET","document.xml", true); 
     xmlhttp.send(); 
    }

而這裏的HTML：

<button type="button" onclick="fruits()">Fruits</button> 
<button type="button" onclick="vegetables()">Vegetables</button> 
<div id="food">Please select your favorite</div>

來源

2012-09-28 Ken

你的功能fruits()無法正常關閉，並且你的函數vegetables()已經結束了功能fruits()，

也是如此定義函數xmlhttp.onreadystatechange=function()

所以這些功能甚至不會使用，直到fruits()被調用。

您的代碼應該是這樣的：

function fruits() 
    { 
     var 
     xmlhttp; 
     if (window.XMLHttpRequest) 

     {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       xmlDoc = xmlhttp.responseXML; 
       document.getElementById("food").innerHTML=xmlDoc.getElementsByTagName("fruits"); 
      } 
     } 

     //something went wrong here : this code ended up in the function that was to be called when xmlhttp was done with its GET operation. 
     //consequently it was never called 
     xmlhttp.open("GET","document.xml", true); 
     xmlhttp.send(); 
    } // <-- this here bracket was missing 

    function vegetables() 
    { 
     var 
     xmlhttp; 
     if (window.XMLHttpRequest) 
     { 
      // code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     { 
      // code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       xmlDoc = xmlhttp.responseXML; 
       document.getElementById("food").innerHTML=xmlDoc.getElementsByTagName("vegetables"); 
      } 
     } 

     //the same thing happened here 

     xmlhttp.open("GET","document.xml", true); 
     xmlhttp.send(); 
    }

來源

2012-09-28 08:40:35

謝謝提摩太，我在新的編碼，可以請你給我一個例子，我怎麼能解決這個問題嗎？非常感激！ – Ken

你好，歡迎來到StackOverflow。我爲您更新了答案，它現在包含代碼，因爲它可能應該是，並且對某些事情出錯的地方附帶一些註釋註釋。爲了防止將來發生類似情況，請密切關注代碼格式，縮進是一種很好的工具，可以防止出現這種情況，並且語法高亮顯示編輯器也可以提供很多幫助！如果我的回答對你有幫助，不要忘記加註，或者如果它解決了你的問題，一定要把它標記爲可接受的答案。快樂編碼！ –

嗨蒂莫西，謝謝你的回答，但不幸的是仍然沒有工作...什麼都沒有顯示出來......我只用水果嘗試過，仍然...標記名（「水果」）內沒有任何元素顯示:-(，I無法找到加載此信息的方式，請有人幫助我，謝謝 – Ken

使用JavaScript顯示標記名內的所有節點

回答

相關問題