如何在不干扰页面其余部分的情况下预加载图像's的东西

How to preload images without interfering with rest of the page's.. stuff?

本文关键字：图像 加载 情况下 干扰 余部      更新时间：2023-09-26

的几个问题

  1. 旧的堆栈帖子建议使用js只创建一个新的Image（）。src=。。。但这似乎已经不起作用了
  2. 我通过以一种不可见的方式（而不是直接使用可见性：隐藏或类似）将图像包含在页面中获得了一些成功但在加载图像时，这会使页面上的所有其他DOM活动都有点断断续续
  3. 由于跨域策略，无法使用ajax预取资源

那么，基本上，有没有一种已知的方法可以在不干扰DOM的情况下预加载图像？

  1. 您可以尝试将图像加载到屏幕外的容器中。容器将被绝对定位为具有高正或负位置属性（顶部、左侧、右侧或底部）

  2. 您可以尝试使用更现代的"预取"技术。不适用于各种浏览器，但您可以在此处阅读https://css-tricks.com/prefetching-preloading-prebrowsing/

我也不明白你在问题中提到的DOM结结巴巴请检查https://jsfiddle.net/8gmaet0p/.

<div style="position: absolute; top:-999999px">
  <img src="http://cdn.londonandpartners.com/assets/73295-640x360-london-skyline-ns.jpg" style="height:1px; width: 1px;" onload="show()"/>
</div>

在加载和加载图像时，动画运行良好，调用show函数。

相关文章：