浏览器不显示由Javascript创建的图像

Question

所以我正在构建简单的html / javascript游戏。我写了一个脚本，它将2d数组渲染为图像网格。问题是它创建了所有的img，正确地分配了类和src，路径似乎没问题，但仍然没有显示图像。

以下是代码：

2^(f(n)) is not in O(n)

var stage = document.getElementById('stage');
var output = document.getElementById('output');

var map = [
	[1, 0, 0, 0, 0, 3],
	[0, 0, 0, 0, 0, 0],
	[0, 0, 1, 0, 2, 0],
	[0, 0, 0, 0, 0, 0],
	[0, 0, 0, 0, 0, 0],
	[0, 0, 0, 0, 1, 0]
];

var water = 0;
var island = 1;
var pirate = 2;
var home = 3;

var size = 64;

var rows = map.length;
var columns = map[0].length;



function render() {
	for (var row = 0; row < rows; row++) {
		for (var column = 0; column < columns; column++) {
			var cell = document.createElement('img');
			cell.setAttribute('class', 'cell');
			stage.appendChild(cell);
			switch(map[row][column]) {
				case water: cell.src = "../img/water.jpg";
					break;
				case island: cell.src = "../img/island.png";
					break;
				case pirate: cell.src = "../img/pirate.png";
					break;
				case home: cell.src = "../img/home.png";
					break;
			};
			cell.style.top = row * size + "px";
			cell.style.left = column * size + "px";
		}
	}
};

render();

#stage {
  position: relative;
  width: 384px;
  height: 384px;
}

.cell {
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
}

p {
  width: 400px;
}

Answer 1

这是路径的问题 - 使用网址而不是路径将起作用：

case water: cell.src = "https://lh4.ggpht.com/wKrDLLmmxjfRG2-E-k5L5BUuHWpCOe4lWRF7oVs1Gzdn5e5yvr8fj-ORTlBF43U47yI=w300";

服务器正在运行哪个操作系统 - 您在本地测试吗？