使用单个开始/停止按钮循环随机图像(同一按钮有两个不同的Click事件)

<button id="startStopButton">开始/停止</button>

// 获取按钮元素
var startStopButton = document.getElementById("startStopButton");

// 定义一个变量来存储循环的状态
var isLooping = false;

// 定义一个数组来存储图像的URL
var imageUrls = [
  "image1.jpg",
  "image2.jpg",
  "image3.jpg",
  // 添加更多图像URL
];

// 定义一个变量来存储定时器的引用
var timer;

// 开始循环随机图像的点击事件处理程序
startStopButton.addEventListener("click", function() {
  if (!isLooping) {
    // 开始循环
    timer = setInterval(function() {
      // 随机选择一个图像URL
      var randomIndex = Math.floor(Math.random() * imageUrls.length);
      var randomImageUrl = imageUrls[randomIndex];

      // 在页面上显示图像
      var imageElement = document.createElement("img");
      imageElement.src = randomImageUrl;
      document.body.appendChild(imageElement);
    }, 1000); // 每隔1秒显示一个图像

    // 更新循环状态
    isLooping = true;
  } else {
    // 停止循环
    clearInterval(timer);

    // 更新循环状态
    isLooping = false;
  }
});