使用javascript在html中随机显示/隐藏图像

在HTML中使用JavaScript随机显示/隐藏图像可以通过以下步骤实现：

首先，在HTML文件中创建一个容器元素来放置图像，例如一个<div>元素，给它一个唯一的ID，比如imageContainer。
在HTML中引入一个JavaScript文件，用于处理图像的显示和隐藏逻辑。例如，创建一个script标签，并将src属性设置为你的JavaScript文件路径。
在JavaScript文件中，首先获取到要操作的图像容器元素。可以使用document.getElementById()方法，将容器的ID作为参数传入，比如let imageContainer = document.getElementById("imageContainer");。
创建一个数组，用于存储图像的URL地址。数组中的每个元素都是一个字符串，表示一个图像的URL。例如，let imageUrls = ["image1.jpg", "image2.jpg", "image3.jpg"];。
创建一个函数，用于随机显示/隐藏图像。可以使用Math.random()方法生成一个0到1之间的随机数，然后将其乘以图像URL数组的长度，再使用Math.floor()方法将结果向下取整，得到一个随机索引值。根据这个索引值从数组中获取一个图像URL，然后将其设置为图像容器元素的背景图像。如果要隐藏图像，可以将容器的背景图像设置为一个空字符串。函数可以命名为toggleImage()。
在HTML文件中使用一个按钮或其他触发事件的元素，给它一个唯一的ID，并添加一个点击事件的监听器。当该元素被点击时，触发toggleImage()函数。

下面是一个示例代码：

HTML文件：

<!DOCTYPE html>
<html>
<head>
  <title>随机显示/隐藏图像</title>
</head>
<body>
  <div id="imageContainer"></div>
  <button id="toggleButton">点击切换图像</button>
  
  <script src="script.js"></script>
</body>
</html>

JavaScript文件（script.js）：

let imageContainer = document.getElementById("imageContainer");
let imageUrls = ["image1.jpg", "image2.jpg", "image3.jpg"];

function toggleImage() {
  let randomIndex = Math.floor(Math.random() * imageUrls.length);
  let imageUrl = imageUrls[randomIndex];
  
  if (imageContainer.style.backgroundImage === "url(\"" + imageUrl + "\")") {
    imageContainer.style.backgroundImage = "";
  } else {
    imageContainer.style.backgroundImage = "url(\"" + imageUrl + "\")";
  }
}

let toggleButton = document.getElementById("toggleButton");
toggleButton.addEventListener("click", toggleImage);

这样，当点击按钮时，图像容器中会随机显示/隐藏图像。你可以根据实际需求，替换imageUrls数组中的图像URL。另外，你还可以通过CSS来设置图像容器的样式，使图像显示得更加美观。