Javascript：未捕获的TypeError：无法调用null的方法'addEventListener'
我正在尝试做一些相当简单的事情，但是由于我可能不够出色而无法搜索文档，因此无法正常工作。
我有一个运行正常的内联JS，看起来像这样：
<A title="Wolfram IP Calc" href="javascript:txt=prompt('Enter%20IP%20address,%20e.g.%2010.20.30.40/29','1.2.3.4/5');%20if(txt)%20window.open('http://www.wolframalpha.com/input/?i='+txt);void(O);">Compute!</A>
由于各种原因，我试图分离JS，而这正是我遇到的障碍。
我创建了以下测试页面，该页面给出了错误消息Uncaught TypeError: Cannot call method 'addEventListener' of null：
<HTML> <HEAD profile="http://www.w3.org/2005/10/profile"> <script type="text/javascript">
var compute = document.getElementById('compute');
compute.addEventListener('click', computeThatThing, false);
functhtml" target="_blank">ion computeThatThing() {
txt=prompt('Enter%20IP%20address,%20e.g.%2010.20.30.40/29','1.2.3.4/5');
if(txt) {
window.open('http://www.wolframalpha.com/input/?i='+txt);
}
}
</script></HEAD>
<BODY>
<A title="Wolfram IP Calc" id="compute" href="javascript:void(O);">Test</A>
</BODY>
</HTML>
我唯一能找到的问题就是这样的问题，它addEventListener无法使用<A>但应该处理<IMG>（这很适合我，因为我将其倒在一些图像上），所以我尝试添加以下无济于事：
<img id="compute" src="http://products.wolframalpha.com/images/products/products-wa.png" />
在此先感谢您指出我做错了什么。这可能是显而易见的，但是我对JS的经验几乎为零，而到现在为止，我大部分时间都是通过货物培训来学习。
问题答案：
您的代码在<head>=>运行于元素呈现之前，因此document.getElementById('compute');返回null，因为MDN承诺…
元素= document.getElementById（id）; element是对Element对象的引用； 如果文档中没有指定ID的元素，则为null。
解决方案：
- 将脚本放在页面底部。
- 在加载事件中调用附加代码。
- 使用jQuery库，它是DOM ready事件。
什么是jQuery ready事件，为什么需要它？
（为什么不仅仅是JavaScript的load事件）：
尽管JavaScript提供了呈现页面时执行代码的load事件，但是只有在完全接收到所有资产（例如图像）之后，才会触发此事件。在大多数情况下，可以在完全构建DOM层次结构后立即运行脚本。确保传递给.ready（）的处理程序将在DOM准备就绪后执行，因此通常这是附加所有其他事件处理程序的最佳位置…
…
-
问题内容： 我收到以下错误 未捕获的TypeError：无法读取null的属性’appendChild’ myRequest.onreadystatechange @ script.js：20 与我下面的代码 这是我的JavaScript文件 这是内容 这是一个简单文本文件的内容。 我在这里按照@Tejs的建议将脚本标签放在html的底部，但仍然出现此错误。 问题答案： 执行回调时，页面上没有ID
-
问题内容： 当我用下面的代码来做一些本机支持的动画时： 直接致电会给… 未捕获的TypeError：非法调用 在Chrome中。为什么？ 问题答案： 在您的代码中，您正在将本机方法分配给自定义对象的属性。当您调用时，它将在当前对象（即支持）的上下文中执行。为了使本机requestAnimationFrame函数正常工作，必须在的上下文中执行它。 因此，此处的正确用法是 。 警报也会发生相同的情况：
-
我正在创建一个HTML页面，它是使用bootstrap构建的。下面是hello.js文件的最终HTML代码和代码： null null 当我使用submit（提交）按钮而不是alert（报警）单击按钮时，我得到的是错误 未捕获的TypeError：无法设置null的属性“onClick” 有谁能告诉我为什么我要面对这个错误吗？？帮助解决它。
-
问题内容： 我正在尝试将Google MAP API v3与以下代码一起使用。 当我运行这段代码时，浏览器会这样说。 未捕获的TypeError：无法读取null的属性’offsetWidth’ 你有什么线索吗？ 问题答案： 此问题通常是由于在需要运行JavaScript的javascript运行之前未渲染map div引起的。 您应该将初始化代码放在onload函数中或HTML文件底部的标记之前
-
问题内容： 如果这个问题已经回答，我深表歉意。我尝试搜索解决方案，但找不到适合我的代码的任何解决方案。我还是jQuery新手。 对于两个不同的页面，我有两种不同类型的粘滞菜单。这是两者的代码。 我的问题是，底部粘性菜单的代码不起作用，因为第二行代码会引发错误，提示“未捕获的TypeError：无法读取未定义的属性’top’”。实际上，除非将第二行以下的其他jQuery代码放在第二行之上，否则根本不
-
问题内容： 我收到此错误，它源自jquery框架。当我尝试在文档准备好加载选择列表时，出现此错误。我似乎找不到我为什么收到此错误的信息。 它适用于change事件，但是尝试手动执行功能时出现错误。 未捕获的TypeError：无法读取未定义的属性’toLowerCase’-> jquery-2.1.1.js：7300 这是代码 问题答案： 当您调用DOMReady时，的上下文将不是元素。 您可以通