单击图像上的区域时，将显示文本的Onclick

如何解决单击图像上的区域时，将显示文本的Onclick

我的网站有问题。我试图在区域上进行onclick，当我单击图像上的区域时我想显示图像和文本。这是我的意思的示例：

这是我到目前为止创建的：

 <div class="interior" style="padding-left: 243px;">
 <img src="Pres7.png" usemap="#intr">
  <map name="intr">
   <area class="speedo" shape="circle" onclick="" coords="342,126,19" href="">
   <area class="screen" shape="circle" onclick="" coords="518,179,17" href="">
   <area class="light" shape="circle" onclick="" coords="730,229,17" href="">
   <area class="swheel" shape="circle" onclick="" coords="345,259,17" href="">
 </map>
</div>

它应该显示不同的图像和文本，因此我认为需要创建4个功能。

我之所以尝试这样做是因为Internet上有几个示例，但是当我分配变量时，它不起作用。

虽然我可以通过onclick来创建文本和图像，但是我不知道如何在该区域进行操作。

解决方法

有一个名为“ display”的CSS属性，每个HTML元素都有该属性的默认值（其中大多数是“ block”，这意味着它们覆盖了整个X轴），但是您可以指定其中一个值因为该显示属性为“无”，这意味着它是隐藏的，您可以使用JavaScript在“无”（隐藏）和所需的值之间切换。

例如：https://www.w3schools.com/howto/howto_js_toggle_hide_show.asp