JavaScript for循环使用一个函数为几个对象

Question

我正在做一个游戏，有三个骰子方块，点击一个按钮就会显示出随机的面孔。图像由css图像精灵生成。如果随机数为1，则骰子立方体将分配给具有图像精灵的css类。

function diceroll (){

    var randomnumber = Math.floor(Math.random() * (6 - 1 + 1)) + 1;

        switch (randomnumber) {

        case 1:
            document.getElementById("dice1").setAttribute("class", "face1");
            break;
        case 2:
            document.getElementById("dice1").setAttribute("class", "face2");
            break;
        case 3:
            document.getElementById("dice1").setAttribute("class", "face3");
            break;
        case 4:
            document.getElementById("dice1").setAttribute("class", "face4");
            break;
        case 5:
            document.getElementById("dice1").setAttribute("class", "face5");
            break;
        case 6:
            document.getElementById("dice1").setAttribute("class", "face6");
            break;
    }
}

我有一个单独的按钮，当点击它时，应该运行上面的diceroll功能到三个div，ID为dice1、dice2和dice3。

我想用

function gotoloop (){

    for (i = 0; i < 2; i++) {
        // the code that affects dice(n) and n=1 and then diceroll function
        // affects dice1 n+1
    }

}

我研究了一下，但找不到实现最后两行注释代码的方法。请让我知道我的方法是否正确，并帮助我与代码。

Answer 1

如果我正确理解了你的问题，你想要这样的东西：

function diceroll (diceId){

    var randomnumber = Math.floor(Math.random() * 6) + 1;

    switch (randomnumber) {

        case 1:        document.getElementById(diceId).setAttribute("class", "face1");        break;
        case 2:        document.getElementById(diceId).setAttribute("class", "face2");        break;
        case 3:        document.getElementById(diceId).setAttribute("class", "face3");        break;
        case 4:        document.getElementById(diceId).setAttribute("class", "face4");        break;
        case 5:        document.getElementById(diceId).setAttribute("class", "face5");        break;
        case 6:        document.getElementById(diceId).setAttribute("class", "face6");        break;
    }
}

function gotoloop (){
    // Start loop at i=1 because the first ID is dice1
    for (var i = 1; i <= 3; i++) {
        // the code that affects dice(n) and n=1 and then diceroll function affects dice1
        // n+1
        diceroll("dice" + i);
    }
}

或者根据马克·鲍姆巴赫的评论，你可以写：

function diceroll (diceId){

    var randomnumber = Math.floor(Math.random() * 6) + 1;

    document.getElementById(diceId).setAttribute("class", "face" + randomnumber);
}