Как выводить json данные из списка js с задержкой

Помогите пожалуйста! Столкнулся с вопросом: как можно выводить данные json с задержкой в пару секунд из списка js? Проблема состоит в том, чтобы объекты списка выводятся мгновенно и игнорируют интервалы. Пробовал setTimeout, setInterval - не помогает

$(document).ready(function () {
        // catch the form's submit event
        $('#scanner').submit(function () {
            // create an AJAX call
            $.ajax({
                data: $(this).serialize(), // get the form data
                type: $(this).attr('method'), // GET or POST
                url: "{% url 'exampleurl' %}",
                // on success
                success: function (response) {
                    let users = response.answer
                    let result = document.getElementById("result");
                    users.forEach(user => {  
                        let nick = document.createElement("p");
                        nickname.innerHTML = user;
                        result.appendChild(nick);
                       
                    });
                },
                // on error
                error: function (response) {
                    // alert the error if any error occured
                    alert("Все плохо");
                    console.log(response)
                }
            });
            return false;
        });
    })

Ответ приходит и выводится, с этим проблем нет. Однако как сделать задержку вывода p-шек c данными json в div id="result" ?


Ответы (1 шт):

Автор решения: Алексей Шиманский

Примерно так можно:

let i = 0;
let usersCount = users.length;

let interval = setInterval(() => {
    let user = users[i++];
    let nick = document.createElement("p");
    nickname.innerHTML = user;
    result.appendChild(nick); 
    
    if (i === usersCount)
        clearInterval(interval);
}, 1000);

Стоит учитывать, что в данном случае даже первое значение появится через указанный интервал после получения. Если надо делать интервал со второго, то следует вначале вывести данные первого элемента, а в интервале выводить со второго соответственно.

→ Ссылка