Блог

Например HTMLImageElement , есть события, которые он может инициировать при успешном выполнении или сбое загрузки.

Эти события, по-видимому, запускаются асинхронно, даже если изображение не добавлено в документ или является частью фрагмента. Они кажутся подавленными только в том случае, если изображение добавляется к a <template> до того, как событие может сработать:

 // onerror will fire
const image = document.createElement('img');
image.src = '0'
image.onerror = () => log("detached");

// onerror will fire
const fragment = new DocumentFragment();
const fragmentImage = document.createElement('img');
fragmentImage.src = '0';
fragmentImage.onerror = () => log("fragment");
fragment.appendChild(fragmentImage);

// onerror will *not* fire
const template = document.createElement('template');
const templateImage = document.createElement('img');
template.content.appendChild(templateImage);
templateImage.src = '0';
templateImage.onerror = () => log("template first");

// onerror will fire
const templateImage2 = document.createElement('img');
templateImage2.src = '0';
templateImage2.onerror = () => log("template last");
template.content.appendChild(templateImage2);
 

Я попытался просмотреть спецификацию WhatWG, но не нашел ничего, что казалось бы уместным или, по крайней мере, неясным. В то время как спецификация точно описывает шаги , которые необходимо выполнить при обновлении loading или вызове decode() , она, похоже, на самом деле не объясняет загруженный процесс и то, как вызываются различные события, когда src (или srcset я предполагаю) с ними взаимодействуют.