有沒有辦法從json讀取數據到html實時？

Question

對於一個學校項目，我將電報消息實時寫入JSON文件。現在我想在JSON中添加新消息時更新我的​​HTML。我的HTML與JQuery/Knockout.js一起工作。做這個的最好方式是什麼 ？

$(document).ready(function(){ 
var viewModel = function() { 
    console.log('test'); 
    $.getJSON('/apps/telegram/getmessages', function(data) { 
    //console.log(data["messages"]); 
    var jsondata = data["messages"]; 
    console.log(jsondata); 
    for(index = 0; index<jsondata.length; ++ index){ 
    console.log(jsondata[index]); 
    var message = jsondata[index]["message"]; 
    var firstname = jsondata[index]["first_name"]; 
    console.log(message); 
    $('#messages').append('<p>' + message + '</p>'); 
    } 
}) 
.error(function(error){ 
    console.log(error); 

    }); 
} 

ko.applyBindings(viewModel); 
}) 

Answer 1

要近實時地進行更新，使用已有代碼的最簡單方法是設置代碼向服務器請求更新數據的時間間隔。這將在區間反覆運行相同的代碼指定：

setInterval(function() { 
    console.log('test'); 
    $.getJSON('/apps/telegram/getmessages', function(data) { 
    //console.log(data["messages"]); 
    var jsondata = data["messages"]; 
    console.log(jsondata); 

    for(index = 0; index<jsondata.length; ++ index){ 
     console.log(jsondata[index]); 
     var message = jsondata[index]["message"]; 
     var firstname = jsondata[index]["first_name"]; 
     console.log(message); 
     $('#messages').append('<p>' + message + '</p>'); 
    } 
    }) 
    .error(function(error){ 
    console.log(error); 
    });  
}, 
1000); //1000 milliseconds (1 second). Change the value to whatever you need. 

詳情請參閱https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval。