Question

我是HTML和JavaScript新手并尝试使用以下代码。

<!DOCTYPE html>
<html>
<head>
<script>
function displayTime() {
    var elem = document.getElementById("clock");
    var now = new Date();
    if(elem == null) alert("NO clock element");
    elem.innerHTML = now.toLocaleString();
    setTimeout(displayTime, 1000);
}
window.onload = displayTime();

</script>
</head>
<body>
<h1>Digital Clock</h1>
<span id="clock"></span>
</body>
</html>

在上面的代码中，我尝试使用span元素实现数字时钟，并每1秒更新一次。但我可以看到，span元素上的getElementById始终返回null并且无法设置它。我的目标不是实现时钟，而是学习JavaScript。请帮助我，我在这里做错了什么？

Answer 1

问题：window.onload = displayTime();

您正在displayTime中保存函数window.onload的返回值，当窗口加载时，它会运行任何内容。但是displayTime会返回 null 。您无法运行 null 。

您正在寻找的是window.onload = displayTime;，因为您希望displayTime在窗口加载时运行。

由于您立即调用displayTime（在窗口加载之前），因此该范围尚未存在。

Answer 2

那是因为您打电话而不是将displayTime分配给onload。

使用

window.onload = displayTime;

而不是

window.onload = displayTime();

基本上，当您说window.onload=some它评估some并将其值等于window.onload时。

因此，您会说displayTime()它会在加载window之前调用该函数，因此根本不会得到span。

Answer 3

Jsbin

检查此Jsbin文件。我刚刚删除（）;来自window.onload = displayTime;和它的工作。

无法在'span'html元素上使用'getElementById'

3 个答案: