Как правильно прервать загрузку фонового изображения с помощью JavaScript ⇐ CSS

[Anonymous]

Как и в предыдущем вопросе (ссылка), я имею дело с динамическими изменениями фоновых изображений в моем веб-приложении. Однако, в отличие от сценария, обсуждаемого в связанном вопросе, где проблема заключалась в том, будут ли загружены оба изображения при перезаписи правил CSS, я столкнулся с другой проблемой: как эффективно прервать загрузку предыдущего фонового изображения.
Вот что я пробовал:

Код: Выделить всё

// Function to cancel image request
function cancelRequest(element) {
if (imageRequests.has(element)) {
const controller = imageRequests.get(element);
controller?.abort(); // Abort the ongoing request
imageRequests.delete(element);
}
}

// Usage example:
// Create a new AbortController instance for each element
const controller = new AbortController();
// Cancel any ongoing request for this image
cancelRequest(elementToChangeBackground);
// Store the element and its AbortController
imageRequests.set(elementToChangeBackground, controller);

Я попытался использовать интерфейс AbortController, чтобы отменить загрузку предыдущего фонового изображения. Однако, несмотря на реализацию предоставленного решения, я обнаружил, что предыдущая загрузка изображения не прерывается, как ожидалось.

Мой конкретный вопрос: существует ли более эффективный или альтернативный подход к отмене загрузки фонового изображения в JavaScript? Кроме того, есть ли какое-либо понимание того, почему предоставленная реализация может работать не так, как задумано?
Я был бы очень признателен за любые рекомендации, предложения или альтернативные методы, которые могли бы помочь мне добиться желаемого поведения. . Спасибо за помощь!

Подробнее здесь: https://stackoverflow.com/questions/782 ... javascript