Question

我有一个示例HTML页面：

<html>
<head>
    <script src="test.js" type="text/javascript"></script>
</head>
<body>
    <button id="myButton" title="test">Test</button>
</body> 
</html>

与对应的JS代码：

window.onload = function_onload(); 

function function_onload () {
    var myButton = document.getElementById("myButton");
    myButton.addEventListener("click", function_onclick());
}

function function_onclick() {
    alert("Hello word");
}

我不明白为什么变量myButton在这种情况下是null。我应该将window.document作为参数传递给function_onload吗？我已经尝试了这个但它既不起作用。

Answer 1

从它的外观来看，你是立即调用该方法。我相信你想这样做：

window.onload = function_onload

请记住，使用括号调用函数对象，这就是您的情况。因此，只需删除它们就可以引用该函数，而不是立即调用它。

另外，正如Deryck在评论中指出的那样，你在body function_onload函数中对“click”事件监听器做了同样的事情。与以前相同，从function_onclick中删除括号，以便您自己传递函数，而不是立即调用。

myButton.addEventListener("click", function_onclick);
                                                  ^^
                                                  Remove parentheses here

如何在函数中正确访问DOM？

1 个答案: