Firefox:Dive Into Greasemonkey/4.12. Adding images without hitting a central server

Mozilla中文Wiki

您的位置：Dive Into Greasemonkey → 公用模式 → 插入外部图片

4.12. 插入外部图片

Firefox 支持 data: URL, 您通过它可以将大量的内容嵌入到页面中，而这些内容都不用从提供页面的服务器端获得。 您也许从来都没有听说过 data: URLs ，因为 Internet Explorer 不提供对它的支持，所以几乎没人使用它们。但是在用户脚本中它们却很有用处。

var logo = document.createElement('img');
logo.src = 'data:image/gif;base64,R0lGODlhDQAOAJEAANno6wBmZgAAAAAAACH5BAAAAAAA'+
    'LAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D';
document.body.insertBefore(logo, document.body.firstChild);

在这个例子中，<img> 使用了data: URL 。它以编码形式的包含了一整幅图像的信息。一旦这个新元素被加入到某个页面中，它和其他的图片一样被显示出来，但它却不用存储在服务器上。事实上，您可以在您的用户脚本中嵌入图片，它们可以和其它的代码一样分布到网上。

使用 data: URI 来创建您自己的 data: URLs.

实例

• Butler (http://diveintomark.org/projects/butler/butler.user.js)
  
• Zoom Textarea (http://diveintogreasemonkey.org/download/zoomtextarea.user.js)

您还需要参考：

• data:URI kitchen (http://software.hixie.ch/utilities/cgi/data/data)