onload='setInterval("function()",1000)' 不起作用答案

【问题标题】：onload='setInterval("function()",1000)' doesn't workonload='setInterval("function()",1000)' 不起作用
【发布时间】：2013-03-24 03:32:10
【问题描述】：

我有一个 xml 文件，我想每隔一秒将其内容加载到特定的 html div 中，这是解析 xml 文件的 javascript 部分：

function getEntries() {

    if (window.XMLHttpRequest)
        req = new XMLHttpRequest();
    req.onreadystatechange = handleReq;
    req.open("GET", "entries.xml", true);
    req.send(null);

}
function handleReq() {
    if (req.readyState == 4)
        document = req.responseXML;
    var states = document.getElementsByTagName("entry");
    for (i = 0; i < states.length; i++) {
        currentState = states[i];
        document.getElementById("LogArea").innerHTML = "<table><tr><td><b>Name:</b></td><td>"
                + currentState.getAttribute("umessage");
        +"</td></tr><tr><td><b>Message:</b></td><td>"
                + currentState.getAttribute("uname");
        +"</td></tr></table>";
    }
}

这是 xml 文件：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<entries>
<entry umessage="aaaaaaaa" uname="aaaaaaa" />
<entry umessage="Hello everybody" uname="John" />
<entry umessage="Hello everybody" uname="Smith" />
<entry umessage="Hello everybody" uname="Knuth" />
</entries>

这就是 html 部分：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body bgcolor="yellow" onload='setInterval("getEntries()",1000)'>
<div id="LogArea" align="left">
</div>
</body>
</html>

问题是指定的 div 中没有加载任何内容，firebug 内部也没有错误存在

【问题讨论】：

JavaScript 是否加载了标签？
你能扩展“不起作用”吗？什么正在发生您没有预料到？你是什么没有发生？例外？错误？
这里的代码对我有用，什么浏览器，你试过用console.log输出任何数据吗？在我看来，JQuery 会让这更容易一些，但除了函数调用应该是“getEntries”而不是“getEntries()”之外，一切都应该没问题，将完整的代码发布到你的单个文件中
这与您的实际问题无关，但您的 getEntries 函数看起来有点奇怪。您检查是否定义了XMLHttpRequest，如果是则设置rec，但随后您继续并使用rec，这意味着初始检查有点毫无意义，因为如果XMLHttpRequest 它仍然会中断无论如何都没有定义。无论如何，XMLHttpRequest 将始终被定义，除非您需要支持 IE7 或更早版本。如果您需要支持 IE7，那么您需要调整您的 ajax 代码以使用它。如果没有，您可以完全放弃if() 检查，因为它对您没有任何帮助。

标签： javascript xml ajax html

【解决方案1】：

您正试图覆盖function handleReq() 中的document，以便它引用XML 而不是HTML。无论成功与否，它仍然无法正常工作。

首先，您尝试将document 设置为您异步加载的XML。正如 cmets 中所述，这可能会失败（在我的测试中，Chrome 和 IE 9 都不允许我以这种方式覆盖 document）。

document = req.responseXML;
var states = document.getElementsByTagName("entry");

如果失败，则 states 正在您的 HTML 页面中寻找 <entry> 标记（不是您想要的）。如果它成功了，那么你在两行之后就会遇到问题，因为你希望document 再次神奇地成为 HTML 页面而不是 XML：

document.getElementById("LogArea").innerHTML = ...

不要使用属于window 属性的变量名——将您的XML 响应称为其他名称，例如var xmldoc = ...。
不要使用全局变量。您应该使用var whatever = ... 而不是whatever = ... 来定义函数变量。
正如其他人所提到的，setTimeout(String, ...) 是不好的做法，已被弃用。函数在 JavaScript 中是成熟的对象，所以只需传递函数本身（不带引号，不带括号）。
function handleReq() 的整个主体应该在if (req.readyState == 4) 块内（不仅仅是第一行）。如果请求还没有完成，你不想做任何事情。

【讨论】：

+1 我不认为你可以覆盖文档，所以当document.getElementsByTagName("entry"); 实际上是在页面中寻找entry 标签而不是xml。
@Musa 谢谢，这似乎是正确的。我已经更新了我的答案。

【解决方案2】：

将字符串作为第一个参数传递是错误的/已贬值。请改用：

setInterval(getEntries, 1000);

或者如果你需要传递参数：

setInterval(function(){ getEntries('foo') }, 1000);

虽然这可能无法解决您的问题，但请务必牢记。

【讨论】：

【解决方案3】：

使用

setInterval(getEntries,1000)

不要传入evaled 的字符串，而是直接传入函数名。

另一个问题在于您的handleReq 方法，如this answer 中所述：

document = req.responseXML;

替换文档，这意味着你接下来的几行指的是不再存在的东西。

【讨论】：