用JS创建一个非常简单的游戏

Creating a very simple game in JS

本文关键字：非常 一个 简单 游戏 JS 创建      更新时间：2023-09-26

我目前正在用JS制作一个游戏，遇到了一个问题。

我有一个存储图像的2D阵列，现在我想每1秒更改一张随机图片，一切都正常，但我不知道如何更改图片。

如果我想更改数组中的随机单元格，是否必须打印所有其他图像？

我几乎可以肯定，还有另一种方法可以在不做的情况下改变它。

我很乐意得到帮助，如果有人需要其他解释，我很乐意。

您可以尝试在页眉中使用类似的内容。它应该每秒调用changePic()，通过图片数组递增，并在图像元素上设置新图片。

//know your array sizes
var max_x = picArr.length;
var max_y = picArr[0].length;
var current_x = 0;
var current_y = 0;
function changePic()
{
  if(current_y == max_y-1)
  {
    if(current_x == max_x-1)
    {
      current_x = 0;
      current_y = 0;
    }
    else
    {
      current_x++;
      current_y = 0;
    }
  }
  else
    current_y++;
  var pic = picArr[current_x][current_y];
  getElementById('randomImage').setAttribute('src', pic);
  window.setTimeout(changePic, 1000);
}
setTimeout(changePic, 1000);

https://developer.mozilla.org/en/DOM/window.setTimeout

我会从这样的东西开始

var ImageOne = new Image();
ImageOne.src = "UrlToImage";

等等，只是为了确保在游戏开始时加载所有图像

此后，我将使用jQuery:

$("#IdOfImg").attr("src", ImageOne);

您可能想尝试为具有背景图像的元素使用css类，而不是将图像添加到DOM中。我认为一个用于back.png的css类和一个用于1.png的css类就可以了。

每秒切换td元素上的类。

希望这能有所帮助。

相关文章：