javascript - 使用 JavaScript 和 XHTML : XMLHttpRequest's open/send do not work if before onreadystatechange

Question

我不知道它是否“有效”，但我得出这样的结论，因为这里发布的代码仅在两次之后才有效(除了 for 循环(愚蠢的 DOM)中的内容，但这不是重点)点击次数。我假设这是因为在创建 XML 文档之前，它是在第一次单击结束时才获取的。

但是，如果我将 XMLhttpRequest.open 和 XMLHttpRequest.send 方法放在 onreadystatechange 函数之前，则代码将不会在嵌套的 if 语句(检查readystate/status 的语句)内执行。我已经用alert或document.write对此进行了测试。

知道出了什么问题吗？

if (window.XMLHttpRequest)
{
    var xmlhttp = new XMLHttpRequest();
}

function lessonList()
{   
    var xmldoc = xmlhttp.responseXML;

    xmlhttp.onreadystatechange = function() 
    {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
        {
            var getTitle = xmldoc.getElementsByTagName('title');
            var lessonList = document.getElementById('lesson-list');

            for (i = 0; i < getTitle.length; i++)
            {
                var lessonTitle = document.createElement('li');
                lessonTitle.nodeValue = getTitle[i].childNodes[0].nodeValue;

                lessonList.appendChild(lessonTitle);
            }
        }
    };

    xmlhttp.open("GET", 'file.xml', true);
    xmlhttp.send(null);
}

Answer 1

+1 Idealmachine 的答案。需要澄清的是，没有一个 Document 实例与单个 XMLHttpRequest 关联，其中从响应加载 XML 只会更新文档的内容。这与调用 Document.load() 不同。

相反，当发送请求时，XMLHttpRequest 对象会删除其 responseXML 引用的旧 Document，并且当收到响应后，它会使用响应创建一个新的 Document 实例。如果您保留对 responseXML 旧值的引用，它仍然是有效的 Document，但它是来自上一个响应的旧 XML 文档，而不是新文档。

另外记住 for 循环中的 var i 以避免意外的全局。并且在 Element 节点上设置 nodeValue 是没有意义的；您需要 document.createTextNode(string) 并附加它。

您通常会使用辅助函数来获取/设置元素的文本内容，因为传统 DOM 让它变得非常痛苦。 DOM Level 3 Core 的 element.textContent 属性是最简单的方法，但它在 IE 或某些较旧的浏览器中不存在。