桌面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'