Question

我刚刚开始使用javascript，所以请关注我。我有一个练习，我必须创建4个盒子的div。每次刷新页面时，一个div是正确的选择。我想知道的主要问题是如何将div与随机数相匹配？

我的html中的div如下

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>

到目前为止我所拥有的javascript是

var randomNumber = Math.ceil(Math.random()*4);

但我不知道如何才能说明randomNumber == div#是否有功能？然后这样做。

Answer 1

document.getElementById('div' + randomNumber);

应该这样做。然后，您可以从那里设置所需元素的所有属性。

如果你需要做任何复杂的事情，我会采取不同的方法，使特定类的div可供选择，并利用jQuery。这是在上周被问到的，你可以在这里找到我的答案也适用于您的具体问题：https://stackoverflow.com/a/9450352/362536

Answer 2

好的，所以你解释时有四个div。我们将要为他们添加处理用户点击的代码，以便我们为他们添加所谓的事件处理程序。

<div id="div1" onclick="process(1)"></div>
<div id="div2" onclick="process(2)"></div>
<div id="div3" onclick="process(3)"></div>
<div id="div4" onclick="process(4)"></div>

现在在脚本标记上面，代码中的这些div放了以下函数：

function ( divNum ) {
    // Define box as the div on which the user clicked
    var box = document.getElementById('div' + divNum);

    // Compare the div the user clicked on to the random number
    if ( divNum === randomNumber ) {
        // The user chose right
        box.style.backgroundColor = "black";
    }
    else {
        // The user chose incorrect
        box.style.backgroundColor = "red";
    }
}

javascript简单的随机游戏

2 个答案: