javascript - 将图像存储在 Javascript 对象中

Question

我不确定这是否可行，但我想将图像存储在 JavaScript 变量或对象中，当页面加载时，我想让这些图像出现在需要的位置。

我想知道一些图像是否被转换为二进制形式。可以使用 JavaScript 将它们转换回图像吗？

Answer 1

看来 OP 正在请求如何在 JavaScript 中创建数据岛，特别是图像。之前给出的答案都没有提供这样的方法，所以就这样吧。

基本上，您将图像编码为 base64 字符串，然后将其设置为 DOM 元素的源。将 Image 对象的源设置为 url 并不等效，因为它需要额外的 HTTP 连接。

var data = 'data:image/gif;base64,'+
    'R0lGODlhAAEwAMQAAJ2M5Me98GRK1DoYyYBr3PHv++Pe99XO81Y50auc6PBkZEgpzbmt7HJa2I57'+
            // snip //
    'fS3CqU7XGYgE+GqHvrLJ8Tr6qXmqiwAF9CffgnMNqmWHAWNBwwGsKpKsrmJqltOOV69nuYxSkqpo'+
    'Tata18rWtrr1rTIIAQA7';
var icon_elem = document.getElementById("icon_here");
icon_elem.src = data;

上面的代码和完整的例子可以在这里找到:http://www.kawa.net/works/js/data-scheme/base64-e.html