Question

我正在尝试使用函数来重复单独的eventListener的代码。事件监听器仅执行一次处理。 while循环打算完成这个过程＆＃39; num＆＃39;倍。虽然eventListener按钮有效，但会分配＆＃34;骰子 - ＆＃34; +骰子+＆＃34; .png＆＃34;正确并显示相应的图形文件，而while循环则没有。它生成一个随机的.png文件，并显示此num次，即使每次迭代确实产生一个新的随机数。我已经分别为每个案例命名变量以避免混淆。

document.querySelector(".btn-roll").addEventListener("click", function() {
    //1. Rnd number
    dice = Math.floor(Math.random() * 6) + 1;

    //2. Display the result
    var diceDOM = document.querySelector(".dice");
    diceDOM.style.display = "block";
    diceDOM.src = "dice-" + dice + ".png";
    console.log(diceDOM);
});

//roll dice num times
function rollDice(num) {
    var i = 1;
    var dice2 = 0;
    while (i < num) {
        //1. Rnd number
        dice2 = Math.floor(Math.random() * 6) + 1;
        console.log("Dice: " + dice2); //error checking. dice2 is producing new number each loop iteration

        //update diceDOM with new dice value
        var diceDOM2 = document.querySelector(".dice");
        diceDOM2.style.display = "block";
        diceDOM2.src = "dice-" + dice2 + ".png";
        console.log(diceDOM2); //error checking. diceDOM appears to be set on calling loop fist time (not set by dice var, but an alternative random number)
        i++;
    };
};

Answer 1

找到错误 - 或者，没有实际的错误。

为了查看发生的更改，diceDOM2.src需要专门用于控制台记录。由于某些原因，控制台打印整个对象确实提供了更新的src！

DOM - 为操作分配随机数

1 个答案: