为什么JavaScript无法找到给定的InnerHTML并返回无法设置null的属性'innerHTML'？

Question

为什么网站http://xn--wiadomesny-37b.pl/test/会引发Uncaught TypeError: Cannot set property 'innerHTML' of null？

HTML （http://xn--wiadomesny-37b.pl/test/）：

<div class="castle_array" id="2x1" name="2x1"></div>
<div class="castle_array" id="3x1" name="3x1"></div>
<div class="castle_array" id="4x1" name="4x1"></div>
...

JavaScript （http://xn--wiadomesny-37b.pl/test/B_modeWindow.js）：

for (x = 1; x <= 5; x++) {
for (y = 1; y <= 5; y++) {
  document.getElementById(x+"x"+y).addEventListener("click",B_modeWindow('1',this.id));
}}

当我改变

("click",B_modeWindow('1',this.id)

到

("click",B_modeWindow('1','string')

它就像一个魅力 - 为什么？

Answer 1

您的代码存在两个基本问题。

首先，当您执行addEventListener("click", B_modeWindow('1', this.id));时，您 不 将B_modewindow回调分配给点击事件处理程序，您实际上是< strong> 执行 该功能。

其次，在该上下文中this 不引用所点击的元素，它引用 Window 对象，因此{{1给你this.id，改为使用undefined：

要解决此问题，请改用以下内容：

event.target.id

这是一个简化的 DEMO 。