在 HTML 表格中显示 XML 文件

Question

我想在表格中的 html 页面上显示我的 .xml 文件。所以我写了一个javascript程序来从网络服务器获取xml并创建一个表。但是 HTTPRequest Response 始终为 null，因为方法 onreadystatechange 没有被调用。

我的 javascript 程序

function LoadXML(dname) {
var xhttp;
if (window.XMLHttpRequest) {
    xhttp = new XMLHttpRequest();
} else {
    xhttp = new ActiveXObject('Microsoft.XMLDOM');
}
xhttp.onreadystatechange = function () {
    if (xhttp.readyState === 4 && xhttp.status === 200) {
        return xhttp.responeXML;
    } else {
        return $("#errors").text("XML not found");
    }
};
xhttp.open("GET", dname, true);
xhttp.send(false);
}

function UpdateXML() {
xmlDoc = LoadXML('xml/history.xml');
var table = "<tr><th>Auftragsnummer</th><th>Auftraglaufzeit</th><th>Soll-Teile</th><th>Gutteile</th><th>Ausschussteile</th><th>OEE</th></tr>";
if (xmlDoc === null) {
    $("#errors").text("XML document is empty!");
} else {
    var x = xmlDoc.getElementsByTagName("Auftrag");
    for (i = 0; i < x.length; i++) {
        table += "<tr><td>" +
            x[i].getElementsByTagName("Auftragsnummer")[0].childNodes[0].nodeValue + "</td><td>" +
            x[i].getElementsByTagName("Aufnahmezeit")[0].childNodes[0].nodeValue + "</td><td>" +
            x[i].getElementsByTagName("TeileSoll")[0].childNodes[0].nodeValue + "</td><td>" +
            x[i].getElementsByTagName("Gutteil")[0].childNodes[0].nodeValue + "</td><td>" +
            x[i].getElementsByTagName("Ausschussteile")[0].childNodes[0].nodeValue + "</td><td>" +
            x[i].getElementsByTagName("OEE")[0].childNodes[0].nodeValue + "</td></tr>";
    }
}
document.getElementById("history").innerHTML = table;
setTimeout(updateTime, 5000);
}
window.addEventListener("load", UpdateXML);

Answer 1

您正在混合异步和同步代码。

当您发出 AJAX 请求时，代码将继续执行，最终将调用 onreadystatechange。要检索数据，您必须向 LoadXML 函数添加回调。

首先您必须了解同步和异步功能，然后再阅读如何将其实现到 AJAX。

同步/异步：What is the difference between synchronous and asynchronous programming (in node.js)（虽然它说的是节点，但基本上是 JavaScript）

AJAX 示例：https://www.w3schools.com/js/js_ajax_examples.asp

警告：如果你直接去 AJAX 示例，只是复制和粘贴代码，而不了解异步和同步之间的区别，你会在 JavaScript 中重复这个问题。