Question

我正在尝试制作游戏，我只需要这样做，以便每隔一段时间，一个div（看起来像棒球）就会出现在某个位置。我不知道问题，我知道if，否则if语句有效，但是当我有它创建div时，它将无法工作。代码如下：

function createball() {
    rand = parseInt( Math.random() * 4);
    if (rand == 0 ) {    
        baseball = document.createElement("div")
        baseball.style.position="absolute";
        baseball.innerHTML = "<img src='baseball.png'  height=\"20px\" width=\"20px\"/>";
        document.getElementById("field").appendChild(baseball);
        baseball.style.height = "30px";
        baseball.style.width = "30";
        baseball.style.top = "20";
        baseball.style.left = "20";
        setCPS(calculateCPS());
    } else if (rand ==1) {
        baseball = document.createElement("div")
        baseball.style.position="absolute";
        baseball.innerHTML = "<img src='baseball.png'  height=\"20px\" width=\"20px\"/>";
        document.getElementById("field").appendChild(baseball);
        baseball.style.height = "30px";
        baseball.style.width = "30";
        baseball.style.top = "20";
        baseball.style.left = "20";
        setCPS(calculateCPS());
    } else if (rand == 2) {
        baseball = document.createElement("div")
        baseball.style.position="absolute";
        baseball.innerHTML = "<img src='baseball.png'  height=\"20px\" width=\"20px\"/>";
        document.getElementById("field").appendChild(baseball);
        baseball.style.height = "30px";
        baseball.style.width = "30";
        baseball.style.top = "20";
        baseball.style.left = "20";
        setCPS(calculateCPS());
    } else if (rand == 3) {
        baseball = document.createElement("div")
        baseball.style.position="absolute";
        baseball.innerHTML = "<img src='baseball.png'  height=\"20px\" width=\"20px\"/>";
        document.getElementById("field").appendChild(baseball);
        baseball.style.height = "30px";
        baseball.style.width = "30";
        baseball.style.top = "20";
        baseball.style.left = "20";
        setCPS(calculateCPS());
    }
}

Answer 1

你什么时候打电话给这个职能的？由于javascript是单线程的，你必须释放线程，渲染线程有机会绘制它。

使用

setTimeout(createball, 0);

调用你的函数可能会有效。

另一个问题，你有意不去除旧棒球吗？棒球变量需要全球化吗？

如果没有，使用var来声明你的变量是一个更好的决定，以避免污染你的全局范围。

我已按照以下方式重写您的代码，希望它对您有用。

function createball() {
    var rand = parseInt( Math.random() * 4),
        baseball = document.createElement("div");
    baseball.style.position="absolute";
    baseball.innerHTML = "<img src='baseball.png'  height=\"20px\" width=\"20px\"/>";
    document.getElementById("field").appendChild(baseball);
    baseball.style.height = "30px";
    baseball.style.width = "30";

    if (rand == 0 ) {
        baseball.style.top = "20";
        baseball.style.left = "20";
    } else if (rand ==1) {
        baseball.style.top = "20";
        baseball.style.left = "20";
    } else if (rand == 2) {
        baseball.style.top = "20";
        baseball.style.left = "20";
    } else if (rand == 3) {
        baseball.style.top = "20";
        baseball.style.left = "20";
    }
    setCPS(calculateCPS());
}

需要帮助在javascript中创建随机div

1 个答案: