下载图像以备日后使用(指南）

Download image for later usage (guidance)

本文关键字：指南 图像 下载      更新时间：2023-09-26

我正在搜索的是一种方法，它将允许我在用户的浏览器中下载图像，以便稍后使用。该图像将在鼠标悬停事件中激活。问题是，我不想只在用户悬停时下载图像，因为这会产生不良影响。它必须在网站加载时下载。

有什么建议吗？

[编辑]感谢您的建议！我不敢相信我忽略了显而易见的解决方案，并寻找复杂的答案。

使用类似于的东西

<img src="myImage.jpg" class="hidden" />

并将CSS中.hidden类的显示设置为none。然后它将被下载并且不会显示。

然后，当你开始使用图像时，它已经在客户端上了。

执行这种图像"预加载"的常见方法是使用JavaScript Image对象。

var i = new Image;
i.onload = function() {
  console.log("Image: " + this.src + " loaded");
}
i.src = 'uri/to/file';

您要查找的内容称为预加载程序。您有两个选项，可以按照CSS（教程）或JavaScript（教程）进行。其中一个解决方案应该会给你想要的结果。

检查此解决方案："使用CSS、JavaScript或Ajax预加载图像的3种方法"

在网页中检查此预加载图像

只需将所有图像放在一个隐藏的div中。图像将自动加载并缓存在浏览器中。因此，当你再次在鼠标移动上加载图像时，不会产生"坏效果"

 <div style="display:none;">
          <img src="url"  />
    </div>
相关文章：