Question

我正在用Javascript制作游戏，要求用户翻转卡片。我遇到了style.background属性的问题。它在Chrome中工作正常但在IE中却没有。

以下是有问题的代码：

function flipBack() { 
    var tile_1 = document.getElementById(memory_tile_ids[0]);
    var tile_2 = document.getElementById(memory_tile_ids[1]);
    tile_1.style.background = "url('Images/tile_bg.png') no-repeat";
    tile_1.innerHTML = "";
    tile_2.style.background = "url('Images/tile_bg.png') no-repeat";
    tile_2.innerHTML = "";
    memory_values = [];
    memory_tile_ids = [];
}

任何人都可以帮助我吗？提前谢谢。

Answer 1

使用背景图片。 IE支持这种语法。

function flipBack() { 
    var tile_1 = document.getElementById(memory_tile_ids[0]);
    var tile_2 = document.getElementById(memory_tile_ids[1]);
    tile_1.style.backgroundImage = "url('Images/tile_bg.png') no-repeat";
    tile_1.innerHTML = "";
    tile_2.style.backgroundImage = "url('Images/tile_bg.png') no-repeat";
    tile_2.innerHTML = "";
    memory_values = [];
    memory_tile_ids = [];
}

Answer 2

最佳做法是不在js中使用CSS道具的速记版本，因为所有浏览器的行为都不一致，因为像Chrome这样的人会接受声明来设置单独的属性而有些像FF一样。

所以，您可以使用backgroundColor，backgroundRepeat ..等的长手版本，或者更好地转到CSS路线并编写声明，然后在代码中插入钩子以引用它们。

Javascript style.background无法在IE中运行

2 个答案: