Javascript 包含文件並每 30 秒刷新一次

Question

我有 3 個文件，我將它們稱為：

     $nowplaying = file_get_contents("/api/static/nowplaying");
$dj = file_get_contents("/api/static/dj");
$listeners = file_get_contents("/api/static/listeners");

我想通過使用在 div 標簽內的 php 文件中調用它們

'.$dj.'
'.$nowplaying.'
'.$listeners.'

但是我每 30 秒更新一次文件的內容，所以我需要刷新顯示的數據而不刷新頁面。 我在想 javascript jquery 可能是其中之一，但我對它不太熟悉。

非常感謝！

Answer 1

如果你有 jQuery

setInterval(function(){
    $.get("/api/static/nowplaying",function(data){
        // Do something with data
    });
},30000);

使用 javascript 有點像

var request = new XMLHttpRequest();
setInterval(function(){
    request.open('GET', '/api/static/nowplaying', true);
    request.send();
},30000)

request.onload = function() {
    if (request.status >= 200 && request.status < 400) {
        // Success!
        var data = request.responseText;
    } else {
    // We reached our target server, but it returned an error

   }
};

Answer 2

是的，我認為使用 jquery/JavaScript 是您正在尋找的，而且非常簡單。 只需使用 JavaScript 中的setInterval()方法讓它按計划重復運行一個函數。 由於您對此很陌生，因此我將嘗試舉一個簡單的示例。 下面的代碼每 30 秒運行一次updateDiv() 。

<script type="text/javascript" src="//code.jquery.com/jquery-3.1.1.js">
</script>
  <script type='text/javascript'>

var myVar
function updateDiv(){
    clearInterval(myVar);

    alert('your code should go here');

    myVar = setInterval("updateDiv()", 30000);
}
$(document).ready(function(){
    myVar = setInterval("updateDiv()", 30000);
}); 

你可以在這里查看： https : //jsfiddle.net/jglazer63/h6q20dj9/1/