javascript - 桌面 Chrome 中的图像加载

Question

let img1 = document.createElement('img'); 
img1.setAttribute('src', 'https://caniuse.com/img/browserstack.svg');

我创建了一个<img>没有插入到文档中，然后我执行了 setAttribute(src, '')并且资源立即被加载；我想在 <img> 时加载资源被插入到文档中。我能做什么？

Answer 1

在template内创建img标签标签。

var tpl = document.createElement('template')
tpl.innerHTML = '<img>'
var img = tpl.content.querySelector('img')
// won't prefetch the image
img.src = 'https://caniuse.com/img/browserstack.svg'