例如这是显示四个图像的HTML代码。我正在努力使它无论单击什么图像都将被删除。现在，使用下面的当前代码，单击时只能删除第一个图像，而不能删除其他图像。我有一种直觉，认为这与“ this”有关，但显然我在这里做错了。
<html>
<body>
<div>
<img id="images" src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/63200502-9bd3-4132-aab8-0e5141db83f5/dbb8tkh-36d702cf-a4a6-45dc-8155-2c55c798e919.jpg/v1/fill/w_916,h_872,q_70,strp/i_got_you_by_cysys8993_dbb8tkh-pre.jpg?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOiIsImlzcyI6InVybjphcHA6Iiwib2JqIjpbW3siaGVpZ2h0IjoiPD0xMDI0IiwicGF0aCI6IlwvZlwvNjMyMDA1MDItOWJkMy00MTMyLWFhYjgtMGU1MTQxZGI4M2Y1XC9kYmI4dGtoLTM2ZDcwMmNmLWE0YTYtNDVkYy04MTU1LTJjNTVjNzk4ZTkxOS5qcGciLCJ3aWR0aCI6Ijw9MTA3NiJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.BdzRsmxcfX-QreYXtrBtnPqiXpMiQGp-hlW24z1IDeA" />
<img id="images" src="https://upload.wikimedia.org/wikipedia/en/4/44/Red_Dead_Redemption_II.jpg" />
<img id="images" src="https://vignette.wikia.nocookie.net/littlewitch/images/1/10/Little_Witch_Academia_TV_official_poster.jpg/revision/latest?cb=20170206033308" />
<img id="images" src="https://i.guim.co.uk/img/media/fbb1974c1ebbb6bf4c4beae0bb3d9cb93901953c/10_7_2380_1428/master/2380.jpg?width=620&quality=85&auto=format&fit=max&s=1d89b4c566de6bbc7ab42af5588dcf7c" />
</div>
<script language="javascript">
let a = document.getElementById("images");
let imgray = document.querySelectorAll('img');
let x;
for (x of imgray){
a.addEventListener('click', removeImage);
}
function removeImage() {
this.parentNode.removeChild(this);
}
</script>
</body>
</html>顺便说一句，第一张图片是我自己的插图。
在for内部，您将addEventListener调用到a而不是x。
for (x of imgray){
// a.addEventListener('click', removeImage);
x.addEventListener('click', removeImage);
}
这就是为什么好的变量名有用的原因：）