Как добавить объект JSON в таблицу через AJAX с задержкой в ​​JQuery?

Question

Я новичок в js & jquery, я создаю объект json для отображения данных в таблице через внешний json.Но я хочу добавить данные в файл JSON, данные автоматически обновляются в таблице.

$(window).load(function(){      
    $(document).ready(function () {

        var url='json/data.json';
        $.getJSON(url, function (r) {

            for (var i = 0; i < r.length; i++) {
                var tr = $('<tr>');

                tr.append("<td>" + r[i].User_Name + "</td>");
                tr.append("<td>" + r[i].score + "</td>");
                tr.append("<td>" + r[i].team + "</td>");
                $('tbody').append(tr);
            } 

        }); 

    });
});

 <table id="racer_details">
    <tbody>
    </tbody>
</table>

мои данные json:

[
    {
        "User_Name":"John Doe",
        "score":"10",
        "team":"1"
    },
    {
        "User_Name":"Jane Smith",
        "score":"15",
        "team":"2"
    },
    {
        "User_Name":"Chuck Berry",
        "score":"12",
        "team":"2"
    }
]

Это мои примеры данных, сначала я добавляю 3 значения в таблицу, но хочу обновить значения в таблице с задержкой по времени, если я хочу добавить некоторые значения в JSON, он автоматически обновит значения в таблице после задержки.Как это возможно с JQuery с AJAX.

Answer 1

HTML:

   <table id="racer_details">
    <tbody id="racer_data">
    </tbody>
   </table>

JS: Вы можете показывать подобные данные, используя ajax,

$(window).load(function(){      
    $(document).ready(function () {
        $.ajax({
           type:"GET",
           url:"xyz",
           data:{ 'xyz': xyz },
           contentType:"application/json; charset=utf-8",
           dataType:"json",
           success:function (result){
              var dataTab = $.parseJSON(JSON.stringify(result));
              $.each(dataTab.data, function (index, value) {
                    $("#racer_data").append('<tr>'+value.name+'</tr>
                                 <tr>'+value.scor+'</tr>
                                 <tr>'+value.team+'</tr>'
              },
             error: function(){},
          });

    });
});