Установите источник изображения с помощью jQuery с сайта, который предоставляет разные изображения при каждом обновлении

Question

Я хочу динамически загрузить src из Этот человек не существует для нескольких объектов img в DOM.

При использовании функции attr jquery каждый объект img содержит одно и то же изображение.Я хочу, чтобы каждый объект содержал «обновленное» изображение.

Я успешно сумел заставить его работать, используя setTimeout, но предпочел бы, если бы мне не пришлось ждать, пока они загрузятся.

$(document).ready(function() {
    var time = 0;

    $('.imgDNE').each(function(e) {
        time+=2000;
        var obj = $(this);
        window.setTimeout(function() {
            $(obj).attr("src","https://thispersondoesnotexist.com/image?"+ new Date().getTime());
        },time);
    });
});

Answer 1

Попробуйте использовать чистое решение JS с использованием атрибутов DOM:

document.addEventListener("DOMContentLoaded", function() {
    var myImg = document.getElementsByClass("imgDNE")
    myImg[0].setAttribute("src", "https://thispersondoesnotexist.com/image#" + new Date.now());
});

Используйте # в конце URL-адреса, чтобы «обмануть» кэш браузера, не обходя кэши восходящего потока

Вы можететакже попробуйте этот прием, установив для себя атрибут src:

 myImg.src = myImg.src;