Javascript从Sprite获取图像对象

我想使用spritesheet来减少tile游戏的HTTP请求次数

假设有大约2000种不同类型的互动程序，即每次加载游戏时减少2000个请求

精灵高64像素，包含64 x 64像素的分幅

以下代码检索单个图像并开始渲染：

var tiles = new Image();
tiles.src = "tiles.png";

tiles.onload = function() {
    startRendering();
};

---

我的问题是，如何从中检索单个图像对象？

使用纯JS将无法做到这一点。恐怕，您将不得不使用一些CSS来实现这一点

例如，让我们假设，您有一个

<span class="imageholder" style="padding: 64px;"></span>

---

啊，因为我在这个特殊情况下使用的是canvas，所以我认为一个预生成的js文件，其中包含从Base64s加载到数组中的图像对象就可以了，但这是一个非常好的方法，谢谢：）

...

tiles.backgroundImage = 'url(tiles.png)';
tiles.backgroundPosition = '0px 0px'; // apply the position to get any of the image at any position

...