Javascript 单击编号图像后使其消失的最简单方法？

我有一些非常基本的代码，屏幕上有数字1-10（标题为1.jpg、2.jpg等）的图像。将生成一个随机数，如果单击正确数字的图像，将显示提示。如果点击的号码不正确，我希望图像消失。我知道如何通过为每个图像使用单独的函数来实现这一点，但在一个函数中实现这一点的最佳方法是什么？

首先：您的一些代码片段将有助于在此处给出合格的答案

假设这是您实际的html结构（注意：如果您的

img

标记中有

id

，如

），则可以省略一些步骤：

...

使用纯JavaScript，您可以执行以下操作：

var rnd=//产生你的随机数
document.querySelectorAll（“img”）.forEach（img=>{
img.onclick=（）=>{
设src=img.src；
src=src.split（“/”；//获取图像源的数组
src=src[src.length-1]；//获取数组中的最后一个位置（类似于文件名）
src=src.split（“.”；//按“.”拆分文件名（在下一步中分隔文件名和-type）
src=src[0]；
src=parseInt（src）；//通过转换为int，使提取的src与生成的随机数具有可比性
如果（rnd！==src）{
img.parentElement.removeChild（img）；
}否则{
警报（“foo”）；//您的提示
}
};
});

说明：使用方法

document.querySelectorAll

可以选择一组html节点（使用与CSS相同的选择器）。现在，您可以使用

array.forEach

（有关详细说明，请参阅）迭代此数组。现在，您可以在每个

img

上注册

onclick

-方法。考虑到您实际上只有

img

的

src

作为鉴别器，您必须在下一步中从src提取实际文件名

将随机数与文件名进行比较后，您可以利用这样一个事实，即您正在处理一个实际的DOM对象（在forEach循环中）：您可以通过

node.parentElement

（）获得父节点，您可以在其中发出命令以删除它的一个子节点（在本例中是当前图像）

---

我希望这对您有所帮助-如需更多帮助，请提供有关此问题的更多信息：）

请访问，查看内容和。做一些研究，搜索相关话题等；如果遇到问题，请发布您的尝试，注意输入和预期输出。在父元素上使用addEventListener并检查event.target