解析XML文件不起作用

I'm developing an app, where on the click of a button, the program calls information stored in an XML file to show in a <span> tag using JavaScript;

我正在开发一个应用程序，在单击按钮时，程序调用存储在XML文件中的信息，使用JavaScript在标记中显示;

    function viewXMLFiles() {

        console.log("viewXMLFiles() is running");

        var xmlhttp = new HttpRequest();
            xmlhttp.open("GET", "TestInfo.xml", false);
            xmlhttp.send;

        console.log("still running");

        var xmlDoc = xmlhttp.responseXML;

        console.log("getting tired");

        document.getElementById("documentList").innerHTML = xmlDoc.getElementByTagName("documentList")[0].childNodes[0].nodeValue;
        document.getElementById("documentList").innerHTML = xmlDoc.getElementByTagName("documentList")[1].childNodes[1].nodeValue;

        console.log("done");
    }

and then the HTML to call it is (and where the XML file would be shown);

然后是要调用的HTML (XML文件将显示在那里);

<button onclick = "viewXMLFiles();">View Document Info</button><br>

<span id = "documentList">
    <!--This is where the XML will be loaded into-->
</span>

the XML file is;

XML文件;

<document_list>

<document>

    <document_name>Holidays.pdf</document_name>

    <file_type>.pdf</file_type>

    <file_location></file_location>

</document>

<document>

    <document_name>iPhone.jsNotes.docx</document_name>

    <file_type>.docx</file_type>

    <file_location></file_location>

</document>

</document_list>

In the console, the first message comes up, but nothing happens and thats all that appears. But i'm really (like, really new) to XML and parsing and don't understand what's wrong. Can you please help?

在控制台，第一个消息出现了，但是什么也没有发生，这就是所有出现的。但是我真的(喜欢，真正的新)XML和解析，并且不理解什么是错误的。你能请帮助吗?

4 个解决方案

#1

If you want to display the information for each Document, you would want something like this:

如果您想要显示每个文档的信息，您需要如下内容:

<html>
<head>

<script type="text/javascript">
function getMyXML() {

  console.log("viewXMLFiles() is running");

  xmlhttp = new XMLHttpRequest();
  xmlhttp.open("GET","TestInfo.xml",false);
  xmlhttp.send();
  xmlDoc = xmlhttp.responseXML; 

  console.log("still running");

  console.log("getting tired");

  document.getElementById("docname").innerHTML = xmlDoc.getElementsByTagName("document_name")[0].childNodes[0].nodeValue;
  document.getElementById("filetype").innerHTML = xmlDoc.getElementsByTagName("file_type")[0].childNodes[0].nodeValue;

  document.getElementById("docname2").innerHTML = xmlDoc.getElementsByTagName("document_name")[1].childNodes[0].nodeValue;
  document.getElementById("filetype2").innerHTML = xmlDoc.getElementsByTagName("file_type")[1].childNodes[0].nodeValue;

    console.log("done");
}
</script>
</head>
<body>

<input type="button" onclick="getMyXML();" value="Get XML" />

<div id="doclist">
<h2>Document 1</h2>
<label>Docname: </label><span id="docname"></span><br/>
<label>Filetype: </label><span id="filetype"></span><br/>

</div>

<div id="doclist">
<h2>Document 2</h2>
<label>Docname: </label><span id="docname2"></span><br/>
<label>Filetype: </label><span id="filetype2"></span><br/>
</div>

</body>

#2

Use this because You have only one childnode for documentlist

使用它是因为documentlist只有一个子节点

document.getElementById("documentList").innerHTML = xmlDoc.getElementByTagName("documentList")[0].childNodes[0].nodeValue;
document.getElementById("documentList").innerHTML = xmlDoc.getElementByTagName("documentList")[1].childNodes[0].nodeValue;

#3

Note:

注意:

Use getElementsByTagName
使用getElementsByTagName
There is no documentList tag in your xml
xml中没有documentList标记

Tag document is the only array in your xml not document_list

标记文档是xml中惟一的数组，而不是document_list

function viewXMLFiles() {

  console.log("viewXMLFiles() is running");

  xmlhttp = new XMLHttpRequest();
  xmlhttp.open("GET","TestInfo.xml",false);
  xmlhttp.send();
  xmlDoc = xmlhttp.responseXML; 

  console.log("still running");


  var getData = xmlDoc.getElementsByTagName("document");
  console.log("getting tired");

  document.getElementById("documentList").innerHTML = getData[0].getElementsByTagName("document_name")[0].childNodes[0].nodeValue;
  document.getElementById("documentList1").innerHTML = getData[1].getElementsByTagName("document_name")[0].childNodes[0].nodeValue;

    console.log("done");
}

Add one more span with id documentList1 to execute the above code

使用id documentList1添加一个span来执行上述代码。

#4

I think the problem is in:

我认为问题在于:

var xmlhttp = new HttpRequest();

It should be:

应该是:

var xmlhttp = new XMLHttpRequest();

#1