我现在正在做的是使用以下函数来预加载图像以缓存。我想知道是否可以从内存中加载它们以获得更快的加载时间。
function preloadImage (done, i) {
if (!i) { i = 1; }
var img = new Image();
img.onloadend = function () {
if (this.height == 0) { return done(); }
preloadImage(done, i + 1);
};
img.src = "images/" + i;
}
preloadImage(function () { console.log('images loaded'); });
我想做的是加载一个数组image()
元素与 JavaScript,然后在幻灯片中显示它们。
以下是如何放置Image
对象直接进入 DOM,无需重新加载src
预取后:
// wait 2 seconds
setTimeout(() => {
// preload image
var image = new Image();
image.addEventListener('load', function () {
// place into DOM
// assert(this === image);
document.querySelector('img').replaceWith(this);
});
image.src = 'https://www.w3schools.com/w3css/img_lights.jpg';
}, 2000);
<img src="https://www.w3schools.com/howto/img_fjords.jpg"/>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)