2013-05-30 50 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