jsはシンプルなカウントダウンを実装します
|
この記事の例では、参考までに簡単なカウントダウンを実装するためのjsの具体的なコードを共有しています。具体的な内容は次のとおりです。
コード： <!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
<script src="./3. 10未満の場合はゼロを入力してください.js"></script>
<スタイル>
div {
フロート: 左;
幅: 100ピクセル;
高さ: 100px;
背景色: #000;
テキスト配置: 中央;
行の高さ: 100px;
色: #fff;
フォントサイズ: 30px;
右マージン: 10px;
}
</スタイル>
</head>
<本文>
<div></div>
<div></div>
<div></div>
<div></div>
<スクリプト>
タグ名によって要素を取得します。
var inputTime = +new Date('2021-02-05 00:00:00'); // ユーザーの入力時刻から 1970 年 1 月 1 日までの合計ミリ秒数 setInterval(countTime, 1000);
カウントタイム();
関数 countTime() {
var nowTime = +new Date(); //現在の時刻から1970年1月1日までの合計ミリ秒数 // console.log(timer);
var times = (inputTime - nowTime) / 1000; // 秒 var d = parseInt(times / 60 / 60 / 24); // 日 div[0].innerHTML = addZero(d) + 'days';
var h = parseInt(times / 60 / 60 % 24) //div[1].innerHTML = addZero(h) + 'time';
var m = parseInt(times / 60 % 60); //div[2].innerHTML = addZero(m) + '分';
var s = parseInt(times % 60); //秒 div[3].innerHTML = addZero(s) + 'seconds';
}
</スクリプト>
</本文>
</html>以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: mysql 5.7.11 winx64.zip インストールと設定方法のグラフィックチュートリアル
>>: Linux サーバーのステータスとパフォーマンスに関連するコマンドの詳細な説明
推薦する
deepin apt コマンドを使用して最新バージョンの docker をインストールする方法
ステップ1: Ubuntuソースを追加するルートに切り替える suルートソフトウェアソースファイルの...
MySQL Limitクエリのパフォーマンスを向上させる方法
MySQL データベース操作では、一部のクエリを実行するときにデータベース エンジンが完全なテーブル...
MySQL 自動インクリメント ID 枯渇の例
ディスプレイ定義IDテーブルに定義された自動増分IDが上限に達した場合、次のIDを申請する際に得られ...
SQLベースのクエリステートメント
目次1. 基本的なSELECT文1. 指定されたフィールドをクエリする3. エイリアスを設定する4....
JS でモバイルのインタラクティブ エクスペリエンスを向上させる方法
目次1. 即時フィードバック1.1 ボタンからの即時フィードバック1.2 継続的なフィードバック1....
Vue の新しいパートナー TypeScript クイックスタート実践記録
目次1. 公式の足場を使って構築する2. プロジェクトディレクトリ分析3. TypeScript の...
JavaScript でアルゴリズムの複雑さを学ぶ方法
目次概要Big O 表記法とは何ですか?オー(1)の上） （n^2） O(logn) ですの上！）結...
MySQLの結合の基本原理についての簡単な説明
目次結合アルゴリズム駆動テーブルと非駆動テーブルの違い1. 単純なネストループ結合、単純なネスト、イ...
Linux trコマンドの使用
1. はじめにtr はテキストの一部を変換または削除するために使用されます。 tr は transl...
MySQLデータベースを別のマシンに移行する方法の詳細な説明
1. まず、移行サーバー上のデータ ファイルを見つけます。MySQL 5.7 とデフォルトのインスト...
MySQL 文字セットの文字化けとその解決方法
序文文字セットは、一連のシンボルとエンコード規則です。Oracle データベースでも MySQL デ...
他の人が私のウェブページを保存したり、サイトをコピーしたりするのを防ぐためのヒント
現在、インターネット上でウェブサイトをコピーすることは非常に一般的です。では、他人が私たちのウェブサ...
モバイルでのHTML5経由のファイルアップロード
ほとんどの場合、PC でファイルをアップロードするにはプラグインが使用され、フラッシュが導入されても...
MySQL 全体または単一のテーブルデータのエクスポート
単一のテーブルをエクスポートするmysqldump -u ユーザー -p db名 テーブル名 >...
MySQL マスタースレーブレプリケーションと読み取り書き込み分離の詳細な説明
目次序文1. 概要2. 読み取りと書き込みの分離3. MySQL マスタースレーブレプリケーションの...