Javascriptの時計

私は時計をjavascriptで作りましたが、その静的時計です。 1秒ごとに更新されるように、次のコードで何を変更する必要がありますか？Javascriptの時計

<html> 
<head> 
    <title>Javascript Clock</title> 
    <script type="text/javascript"> 
     function clk() { 
      var a=new Date(); 
      document.getElementById("disp").innerHTML=a.getHours() + ":" + a.getMinutes() + ":" + a.getSeconds() ; 

     } 
    </script> 
</head> 

<body> 
    <input type="button" onclick="clk()" value="Display Clock" /> 
    <p id="disp">Clock Space</p> 
</body> 

</html>

出典

2012-02-12 sandbox

['setInterval']（https://developer.mozilla.org/en/DOM/window.setInterval）を見てください：' window.onload = function（）{setInterval（clk、1000）;}} ; ' –

@RobW' 1000 'とは何が関係していますか？ – sandbox

彼のコメントには、あなたの質問に答える 'setInterval'に関するドキュメンテーションへのリンクが含まれています。 –

あなたは毎秒あなたのCLK（）関数を実行するためにsetIntervalを使用することができます。

setInterval(clk, 1000); // run clk every 1000ms

MDN on setInterval

NNNNNNが指摘するように、タイマー間隔はおそらく通過と同期されることはありません実際のリアルタイム秒数の100msのような間隔を使用することは悪い考えではないかもしれません。あなたが怒鳴るよう、あなたの関数にsetTimeout(clk,1000);を追加することができます

出典

2012-02-12 10:12:39 Twisol

注：タイマーの間隔が正確であるとは限らないため、毎秒1回、たとえば100msごとに更新を頻繁に行うと、クロックがよりスムーズに実行されます。 – nnnnnn

@nnnnnn：素晴らしい観察！私はそれを私の答えに取り入れました。 :) – Twisol

-1

：

function clk() { 
     var a=new Date(); 
     document.getElementById("disp").innerHTML=a.getHours() + ":" + a.getMinutes() + ":" + a.getSeconds() ; 
     setTimeout(clk,1000); 
    }

出典

2012-02-12 10:46:30

setTimeout回答のカップルで提案されているようには正解ではありません。 setTimeoutとsetIntervalは同じように見えますが、setTimeoutは単一のイベントを意味し、setIntervalは時計のような繰り返しイベントを意味します。

したがって、setIntervalは正しい回答ですが、のTwisolの投稿では、ソリューションの半分しか提供していません。 setInterval関数は、ページがロードされたときにタイマーを開始しますが、別のページをロードするときにタイマーを停止する必要もあります。そうしないと、時計ページを再び読み込むたびに、新しいタイマーが開始されますが、古いタイマーはブラウザによって保持されます。

<body onLoad="startTimer();" onUnload="stopTimer();">

あなたはsetTimeout機能は、あなたがclearTimeout関数の引数として渡すタイマーのIDを返すタイマーを起動すると：

var intervalID; 
function startTimer() { 
    intervalID = window.setInterval(updateDateAndTime, 200); 
} 

function stopTimer() { 
    window.clearInterval(intervalID); 
}

NNNNNNがあり更新頻度に関するポイント。ただし、フルアップデート機能を毎秒10回実行する必要はありません。たとえば、私の時計機能は時計の設定でクッキーを読み取ります。あなたは毎秒10回クッキーを読んではいけません。より重要なケースは、XMLHttpRequestの呼び出しです。サーバーは常に100ミリ秒以内に応答する場合もあります。
私は通常、updateDateAndTime関数が呼び出されるたびにインクリメントするティックカウンタを作成し、インスタンス100に達するとリセットします。つまり、ティックカウンタは10秒ごとにリセットされます。それはクッキーを読むため、またはXMLHttpRequestを送信するための良い頻度です。ティックカウンタがリセットされるたびに毎秒10回実行する必要のない機能をグループ化して実行するだけです。

出典

2013-12-10 14:11:42 stevenvh

技術的には、clkは再帰的にsetTimeout – OneStig

答えて

関連する問題