なぜelement.innerHTML =日付情報付き文字列が機能しないのですか？

Question

私はsetInterval()で、この問題に遭遇しました：

var h1 = document.getElementById("demo"); 

function updateTime(d) { 

    h1.innerHTML = "numero del mese: " + d.getDate() + 
    "<br>numero della settimana: " + d.getDay() + 
    "<br>anno: " + d.getFullYear() + 
    "<br>mese: " + d.getMonth() + 
    "<br>ore: " + d.getHours() + 
    "<br>minuti: " + d.getMinutes() + 
    "<br>secondi: " + d.getSeconds(); 
} 

setInterval(updateTime.bind(null, new Date()), 1000); 

このすべてが正常に動作しますが、それは何も、一度だけ、その後に動作しません。 なぜですか？

Answer 1

new Date()は、オブジェクトが

を作成された時刻は、あなたがその時（を変更しない）秒ごとに示し間隔でそれを使用し、一度、それを呼び出すを表すDateオブジェクトを作成します。

あなたは現在の時間を取得したい場合は、あなたは間隔で呼び出す関数内で新しいDateオブジェクトを作成する必要があります。例えば

：あなたは.bind(null, new Date())を使用しているため

setInterval(function() { updateTime(new Date()); }, 1000); 

Answer 2

です。したがって、今後のすべての呼び出しでは、最初に作成されたのと同じ日付です。私は、の現在の時刻をにするために毎回new Date()を呼び出すことを提案します。下記参照。

var h1 = document.getElementById("demo"); 
 

 
    function updateTime() { 
 
     let d = new Date(); 
 
     
 
     h1.innerHTML = "numero del mese: " + d.getDate() + 
 
     "<br>numero della settimana: " + d.getDay() + 
 
     "<br>anno: " + d.getFullYear() + 
 
     "<br>mese: " + d.getMonth() + 
 
     "<br>ore: " + d.getHours() + 
 
     "<br>minuti: " + d.getMinutes() + 
 
     "<br>secondi: " + d.getSeconds(); 
 
    } 
 

 
    setInterval(updateTime, 1000);

<h1 id="demo"></h1>

Answer 3

新しいDateオブジェクトは、一度作成され、あなたは、すべての関数呼び出しで同じオブジェクトを使用しています。だから、すべての呼び出しで日付は変わらない。

関数内に新しいDateオブジェクトを作成する必要があります。そのため、関数が呼び出されるたびに時刻が更新されるたびに作成されます。

は以下のスニペットチェック：

var h1 = document.getElementById("demo"); 
 

 
function updateTime() { 
 
    var d = new Date(); 
 
     
 
    h1.innerHTML = "numero del mese: " + d.getDate() + 
 
    "<br>numero della settimana: " + d.getDay() + 
 
    "<br>anno: " + d.getFullYear() + 
 
    "<br>mese: " + d.getMonth() + 
 
    "<br>ore: " + d.getHours() + 
 
    "<br>minuti: " + d.getMinutes() + 
 
    "<br>secondi: " + d.getSeconds(); 
 
} 
 

 
setInterval(updateTime, 1000);

<div id="demo"></div>