Cha*_*kal 5 html javascript jquery
是否需要向 DOM 添加 an<img>才能预加载它?
$(function whenDOMIsHappy(){
var $img = $('<img />')
.load(loadHandler)
.error(errorHandler)
.attr({src:"squatchordle-squashgarden.jpg"});
$img.appendTo('body .preloads'); // is this at all necessary?
});
// assuming <div class="preloads" style="display:none;"></div> exists in <body>.
Run Code Online (Sandbox Code Playgroud)
我看到过关于这项技术的混合信息。我正在使用 jQuery,但这个问题也适用于普通人。
我有兴趣在所有主要浏览器中保持此功能。
我测试过的所有浏览器都会加载图像,即使它们不在 DOM 中。您可以使用https://jsfiddle.net/84tu2s9p/进行测试。
const img = new Image();
img.src = "https://picsum.photos/200/300";
img.onload = () => console.log("loaded");
img.onerror = err => console.error(err);
Run Code Online (Sandbox Code Playgroud)
(并不是详尽的列表。我只是尝试了各种版本和浏览器。)
还有一个新的image.decode()API 专门用于预加载图像的用例,并避免在实际解码图像以渲染图像时潜在的丢帧。Edge 尚不支持(但基于 Chromium 的 Edge 会支持)。
鉴于 HTML Canvas 可以在不存在 DOM 的情况下使用图像,我认为它们必须加载图像。
| 归档时间: |
|
| 查看次数: |
2803 次 |
| 最近记录: |