2013-05-30 53 views
2

我接近我的智慧'在這裏結束什麼應該是一個簡單的問題。我正在嘗試使用JavaScript解析並將值從一個非常簡單的XML文檔轉換爲一個非常簡單的HTML文檔。我的問題是我的腳本拒絕這樣做。 的XML:JavaScript的XML解析不起作用

<?xml version="1.0" encoding="ISO-8859-1"?> 
<root> 
<man> 
    <name>Nicholas</name> 
</man> 
<man> 
    <name>Peter</name> 
</man> 
</root> 

這是嚴格爲我自己的教育,因此漫無目的的標籤。

中的JavaScript:

<script> 
function loadXMLDoc(dname) 
{ 
if (window.XMLHttpRequest) 
    { 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.open("GET","dname",false); 
xmlhttp.send(); 
return xmlhttp.responseXML; 
} 

xmlDoc =  loadXMLDoc("https://dl.dropboxusercontent.com/u/22818342/Testing/javascript_test4.xml"); 

x = xmldoc.getElementsByTagName("name"); 

var content = function() 
{ 
    document.write(x[0].childNodes[0].nodeValue); 
}; 
</script> 

請注意,我用我的Dropbox公用文件夾,使代碼的HTTP擷取部分。所有這些文件都位於相同的目錄中。

的(相關)HTML:

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<link href="https://dl.dropboxusercontent.com/u/22818342/Testing/javascript_test3.css" rel="stylesheet" type="text/css" /> 
<body> 
<button type="button" onclick="content()">Click Me</button> 
<body> 

還要注意的是,當我按一下按鈕,表面上發射的content()功能,沒有任何反應 - 這不是被改寫一切的問題。

其他相關信息: --I'm從W3Schools的XML解析演示,並從另一個StackOverflow的職位從用戶測試這個谷歌瀏覽器 --I解禁大部分代碼(同樣,只有學習的目的)與我的問題類似。 在這兩種情況下,的代碼運行良好;只有當我試圖運行它時,事情纔會變得糟糕。 - 我對Javascript和XML DOM相當陌生,所以我完全有可能在某個地方犯了一個基本錯誤。

我很感謝社區可以提供的任何幫助。

+0

劃痕,在你的初始呼叫,不要引用了變量名一看:'xmlhttp.open(「GET」,DNAME,FALSE) ;' – faino

+0

做到這一點,仍然沒有骰子...你看別的,可能是造成問題的原因? –

回答

2

對於初學者,您是否嘗試過查看它提供的內置調試工具(稱爲開發人員工具)?請參閱此處以獲取基本介紹:https://developers.google.com/chrome-developer-tools/。如果您打開鏈接中提到的開發人員工具,那麼您發佈的代碼在進入控制檯選項卡時會吐出一些錯誤。

你的兩個問題與代碼開發工具會顯示您:

  • 當您嘗試訪問您的變量xmlDoc你沒有正確裝箱它。
  • 在您的loadXMLDoc函數中,您打開的調用正在請求一個名爲"dname"的相關資源(作爲字符串),看起來您要做的實際上是使用變量dname

一個修正,因此版本將是:

function loadXMLDoc(dname) 
{ 
if (window.XMLHttpRequest) 
    { 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.open("GET",dname,false); 
xmlhttp.send(); 
return xmlhttp.responseXML; 
} 

xmlDoc =  loadXMLDoc("https://dl.dropboxusercontent.com/u/22818342/Testing/javascript_test4.xml"); 

x = xmlDoc.getElementsByTagName("name"); 

var content = function() 
{ 
    document.write(x[0].childNodes[0].nodeValue); 
}; 
+0

問題解決了!我會記得下次使用調試工具。當然,現在我很沮喪,因爲我花了幾個小時措詞和改寫我的函數只對有問題的是我的外殼和基本語法......啊,這就是生活。 非常感謝! –

0

這裏是接近解析XML到您的文檔有點更不顯眼的方式,以及錯誤回落:

<!DOCTYPE html> 
<html lang="en" dir="ltr"> 
    <head> 
     <title>XML Example</title> 
     <meta charset="UTF-8" /> 
     <script> 
      function content(dname) { 
       var xhttp = null, xml = null, names = null, html = "", output = document.getElementById("output"); 
       output.innerHTML = "Loading..."; 
       if(window.XMLHttpRequest) { 
        xhttp = new XMLHttpRequest(); 
       } else { 
        xhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
       if(!xhttp) { 
        output.innerHTML = "Failed to make the request!"; 
       } else { 
        xhttp.open("GET", dname, false); 
        xhttp.send(); 
        xml = xhttp.responseXML; 
        names = xml.getElementsByTagName("name"); 
        for(var i = 0, len = names.length; i < len; i++) { 
         html += names[i].childNodes[0].nodeValue + "<br />"; 
        } 
        output.innerHTML = html; 
       } 
      } 
      window.onload = function(){ 
       document.getElementById("button").onclick = function(){ 
        content("https://dl.dropboxusercontent.com/u/22818342/Testing/javascript_test4.xml"); 
       }; 
      }; 
     </script> 
    </head> 
    <body> 
     <button type="button" id="button">Click Me</button> 
     <div id="output"></div> 
    </body> 
</html> 
+0

我會記住這一點對我的實際,更復雜的工程。謝謝! 其他快速的問題:什麼是第三(「假」)上xhttp.open參數()實際上呢? –

+0

這是呼叫是否被異步的,[更多的信息可以在這裏找到(https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#open()) – faino

0

在firefox中使用ctrl + shift + j鍵查看錯誤,如果你使用螢火蟲,進入螢火蟲的「NET」選單標籤,你可以看到請求和響應或任何錯誤。

要了解更多關於XML解析對此網站XML DOM