为什么JavaScript可以'找不到给定的InnerHTML并返回Cannot set property

Why JavaScript can't find given InnerHTML and returns Cannot set property 'innerHTML' of null?

本文关键字：返回 InnerHTML Cannot set property 可以 JavaScript 找不到 为什么      更新时间：2023-09-26

为什么选择站点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')

它就像一个符咒——为什么？

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

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

其次，在该上下文中，this不是指点击的元素，而是指Window对象，因此this.id给了你undefined，而使用event.target.id：

要修复它，请使用以下方法：

var el = document.getElementById(x+"x"+y);
el.addEventListener("click", function (event) {
  B_modeWindow('1', event.target.id);
});

这是一个简化的演示。

相关文章：