Загрузка изображения в Desktop Chrome

Question

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

Я создал <img> без вставки в документ, затем я выполнил setAttribute(src, ''), и ресурс был загружен немедленно; Я хочу загрузить ресурс, когда <img> вставлен в документ. Что я могу сделать?

Answer 1

Создайте тег 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'