Question

我在下面的代码段中遇到此错误。

Uncaught TypeError: Cannot set property 'src' of undefined

我正在尝试使用“ let”来声明变量。因此，没有办法利用吊装的优势。如果我在变量声明之后声明函数，则会再次引发另一个问题。请让我知道该怎么办？

<img id="imgMine" src = img.png> 
<script>
let myImg;
function explosion (){
    myImg.src = "";//**<-- Uncaught TypeError: Cannot set property 'src' of undefined**
}
myImg= document.getElementById("imgMine").onclick = explosion();
</script>

Answer 1

您已将explosion()的返回值分配给myImg（以及document.getElementById("imgMine").onclick，但这并不是真正的无关紧要）。

explosion没有return语句，因此它返回undefined。

因此“无法设置未定义的属性'src'”。

这与使用let而不是var完全无关。

您似乎正在尝试设置图片元素的src属性。如果要这样做，则需要将图像元素分配给变量。

myImg = document.getElementById("imgMine");

您似乎还想将explode函数分配为单击事件侦听器。为此，您需要自己分配功能而不是调用的结果。丢掉()。

myImg.onclick = explode;

或者您可以使用现代习语：

myImg.addEventListener("click", explode);

也就是说，图像并非设计为交互式控件。虽然可以向其添加click事件处理程序，但它在辅助技术中不会显示为可单击（如屏幕阅读器），也不会在没有指针设备的情况下导航到（许多人通过页面中的交互式元素来进行选择）。 / p>

简而言之，您正在做的事情不可访问（可能会导致您的法律问题）。

您应该使用旨在被点击的元素，例如按钮。

let myImg;

function explosion() {
  myImg.querySelector("img").src = "";
}

myImg = document.getElementById("imgMine");
myImg.addEventListener("click", explosion);

button {
  border: 0;
  background: transparent;
  margin: 0;
  padding: 0;
}

<button type="button" id="imgMine"><img src="https://placeimg.com/200/100/tech"></button>

尝试用“ let”替换“ var”时未捕获到TypeError

1 个答案: