Webページのオンライン時計機能をJavaScriptで実装する方法

方法: 1. Date メソッドを getHours、getMinutes、getSeconds メソッドとともに使用して、現在時刻の時、分、秒を取得します; 2. 「setInterval (時刻を取得する関数名、1000)」を使用します。それぞれを設定するステートメントは、取得した時間を 1 秒ごとに更新するだけです。

このチュートリアルの動作環境: Windows 10 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript は Web ページのオンライン クロック機能をどのように実装しますか?

JavaScript は、オブジェクトおよびイベント駆動型に基づいたスクリプト言語であり、実行されます。クライアント側での処理が完了するため、サーバー側の負担が軽減されます。完全な JavaScript は、コア構文、ブラウザー オブジェクト モデル、およびドキュメント オブジェクト モデルで構成されます。ここで、ページに時計をリアルタイムで表示する小さな機能を実装する方法を説明します。

日付オブジェクトの作成: 日付オブジェクトには、日付と時刻の 2 つの情報が含まれています。日付オブジェクトを作成するには、2 つの基本的な構文があります:

方法 1: var date instance = new Date (parameter);

方法 2: var dateinstance=new Date();

Date オブジェクトの get メソッドを通じて日付、時刻などを取得します。ページ上に表示するには、DOM の innerHTML 属性を使用して設定できます。

#if ステートメントを使用して、現在の時間が 12 時より大きいかどうかを判断し、午前と午後を判断します。

リアルタイムに表示するにはどうすればよいですか? JavaScript には、setTimeout() と setInterval() という 2 つのタイミング関数が提供されています。

• setTimeout(): 指定されたミリ秒数の後に関数または計算式を呼び出すために使用されます。

• setInterval(): 指定された期間 (ミリ秒単位) に従って関数を呼び出したり、式を計算したりできます。

これを実現するには、明らかに setInterval() メソッドの使用が選択されており、ページにはリアルタイムで時間が表示されます。

以上の手順で、リアルタイム表示のコード設計が完了しました。完成したコードは次のとおりです。 OK、操作効果は写真の通りです。なお、このとき時刻はリアルタイム、すなわち1秒に1回変化する。

[関連する推奨事項:

JavaScript 学習チュートリアル

]

以上がWebページのオンライン時計機能をJavaScriptで実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。