Question

下面我的代码应该随机抽取画布上的一块岩石。但是我现在拥有的代码即使经过多次刷新也没有绘制任何内容。我也可以使用循环mathRock函数循环，这样我就可以获得不变的新随机岩石，而不必刷新页面，但我不知道要使用哪个循环。

我的岩石产卵代码如下：

var num;

var rock = new Image();
        rock.src = "rock.png";

mathRock();
spawnRock();

function mathRock() {
            var x = parseInt(Math.random()* 10);
            document.getElementById("num");
            }

function spawnRock() {
            if (num == 2|| num == 4 || num == 6 || num == 8){ 
                context.drawImage(rock, 500, 450);
                } else {                    
                    }
                }

Answer 1

你的mathRock函数是一个无操作：它分配给一个局部变量并执行一个DOM查询，但它不会执行任何与该局部变量或结果的DOM查询。

spawnRock只会看到undefined num，因为您已声明它，但从未为其分配过值。

mathRock可能意味着分配给num而不是x，但目前还不清楚它与DOM查询有什么关系（如果有的话），或者context中的spawnRock意味着来自。{/ p>

Answer 2

document.getElementById("num")会查找包含id="num"的元素，但它不会对全局变量num执行任何操作。

要使其工作，您可以将值分配给变量。要计算随机数，请使用Math.floor方法，而不是将数字解析为数字：

function mathRock() {
  var x = Math.floor(Math.random() * 10);
  num = x;
}

但是，您应该返回值而不是使用全局变量，并将值传递给下一个函数。

您无法使用常规循环重复更改图像，您需要一个计时器。使用setInterval方法。

var rock = new Image();
rock.src = "rock.png";

window.setInterval(function(){
  var num = mathRock();
  spawnRock(num);
}, 5000);

function mathRock() {
  return Math.floor(Math.random() * 10);
}

function spawnRock(num) {
  if (num == 2|| num == 4 || num == 6 || num == 8){ 
    context.drawImage(rock, 500, 450);
  } else {                    
  }
}

图像不是从Math.random函数绘制的

2 个答案: