Michael Zippo
カウントダウンタイマーは、重要なイベントにカウントダウンしたい人がインターネット全体で使用しています。
カウントダウンタイマーを使用して、新しいサイトの立ち上げをカウントできます。カウントダウンタイマーは、製品の発表を行うときに信号を送ることができます。探索する可能性は非常にたくさんあります。
このガイドでは、HTML、CSS、JavaScriptの3つのテクノロジーを使用してJavaScriptカウントダウンタイマーを作成する方法を紹介します。始めましょう！
最初のステップは、基本的なWebページを構成することです。このガイドでは、外部ライブラリの使用について心配する必要はありません。シンプルに保ち、古いHTML、CSS、JavaScriptを使用します。
まず、HTMLファイルを作成します。
現時点では、コードは特別なものを返しません。以下を参照してください。 ITALY <図クラス= "WP-画像ブロック">
私たちは平和とrsquoの天国であるため、そのように思われます。 tはコードにスタイルを追加しておらず、独自のJavaScriptタイマーを作成していません。タイマーをフィードするJavaScriptの作成に進みましょう。
JavaScriptには、日付と時刻の操作に使用できるDateという便利なジェットがあります。このオブジェクトは、カウントする時刻のタイムスタンプを取得する目的と、現在の日付を取得する目的の2つの目的で使用します。
このチュートリアルでは、すべてのスクリプトを1つのラベルに記述します。外部スクリプトは使用しません。
現在の日付からカウントダウンしている日付を引くと、これら2つの日付の差がわかります。
このコードは、次のスターウォーズの日である2021年5月4日までの残り日数を計算します。
この2日間の違いにはいくつかの問題があります。まず、カウントダウンはまだありません。第二に、私たちの日付は、人間が簡単に読み取れる形式で保存されていません。ミリ秒単位で保存されるため、あまり便利ではありません。 。時間を日、時間、分に変換する必要があります
残り時間をより読みやすい形式で計算するには、次のコードを使用します。
次のコードを使用して、文字列の値をフォーマットできます。
このコードでは、文字列補間を使用して、以前に計算された値を置き換えています。これにより、次のようなタイムスタンプが得られます：314日13時間52分。
タイムスタンプを生成したので、Webページに挿入できます：
すべてのコードを1つの関数に移動できます：
ページを読み込むと、次のメッセージが返されます。
Latest questions
