Question

我已经在javascript中使用pi计算器很长一段时间了，我终于完成了。问题是我在头部的脚本：

document.getElementById("button").addEventListener('click', (function(){
    alert('Beginning…');
}), false);

我的身体部分有这个：

<input type="button" id="button" value="Calculate!!"/>

但是当我打开网页时，我收到以下错误：“null不是对象，评估document.getElementById（”button“）。addEventListener”

有谁知道为什么我的代码无法正常运行？

谢谢。

Answer 1

将其包裹在窗口 onload事件中：

window.onload = function()
{
    document.getElementById("button").addEventListener('click', (function(){
        alert('Beginning…');
    }), false);
};

或

window.addEventListener('load', function()
{
    document.getElementById("button").addEventListener('click', (function(){
        alert('Beginning…');
    }), false);
});

或者，如果您的脚本不必在头部，将其放在ID为按钮的元素之后。

<强> DEMO

Answer 2

Javascript会尽快执行，所以当它在head标签中时，文档还没有完全加载。您可以在文档准备好后使用加载

运行代码

window.addEventListener("load", function(){
    /*your code here*/
});

我认为窗口应该是正确的方法，即使人们会认为document.load会存在（“当文档加载时，执行此操作”而不是“当窗口加载时执行此操作”）或者在身体的末尾运行你的代码。你仍然可以掌握所有方法。

Answer 3

您有两种选择：

将您的代码包裹在window.onload事件中。
将<script></script>放在身体底部</body>。

为什么头部选择中的javascript代码不能获得元素？

3 个答案: