【#javascript定番】日付のカウントダウンを行う
2024.07.14
おはようございます．日付のカウントダウンを行うJavaScript言語の定番プログラムコードを作りましたので公開します．昨今、生成AIを使用してこのぐらいのコードは生成出来るかと思っていたのですが、こんなコードでも手直しが必要になりました．
やはり今の生成AIは事細かい指示を出さないと上手く動かないような気がします．それはプログラミングじゃない事でもそんな感じなのかもしれません．
<h1 id="countdown" data-y="2025" data-m="07" data-d="11"></h1>function countdown() {
let Y = document.querySelector('#countdown').getAttribute('data-Y');
let m = Math.floor(document.querySelector('#countdown').getAttribute('data-m')) -1;
let d = document.querySelector('#countdown').getAttribute('data-d');
let strCountDown = '';
let nowDate = new Date();
let countdownDate = new Date(Y,m,d,0,0,0);
let distance = countdownDate.getTime() - nowDate.getTime();
const day = Math.floor(distance / 1000 / 60 / 60 / 24);
const hour = Math.floor(distance / 1000 / 60 / 60) % 24;
const minute = Math.floor(distance / 1000 / 60) % 60;
const second = Math.floor(distance / 1000) % 60;
strCountDown = `${day}日 ${hour}:${minute}:${second}`;
view(strCountDown);
}
setInterval(countdown, 1000);
function view(str) {
document.querySelector('#countdown').textContent = str;
}
デモページはこちらになります．
https://zip358.com/tool/demo94
明日へ続く．
著者名
@taoka_toshiaki
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
countdown, countdownDate.getTime, data-y, distance, document.querySelector, floor, getAttribute, gt, hour, let, lt, minute, nowDate.getTime, querySelector, quot, second, setInterval, STR, strCountDown, textContent,
一時間に一回だけAPIを実行するPHPのオブジェクトファイル
2020.01.10
あるユーザーが公開しているプログラミングを参考にして
オブジェクト化してみた。
参考にしたサイトのリンクは下記になります。
phpでapiを切りの良い時刻までキャッシュする
尚、動作環境はPHP5.6以上になります、と言いつつ
動作テストは行っていないので、もしかしたらエラーで動かないかも？
動作内容はJSONファイルの更新時間（ hour ）と
サーバの 時間 （ hour ） を比べ差異があれば
APIを呼び出し結果をJSONファイルとして上書き保存します。
そのため、一時間に一回だけ更新処理が走ります。
（※CRONで設定していれば）
結果がJSONで返ってこない場合などは可変して頂いて構いません。
もともと自分の案でもないので…。
PHPファイルのダウンロードはこちらから
https://zip358.com/tool/timeKeeper/timeKeeper.zip
ソースコードはこちらになります(*￣(ｴ)￣*)
<?php
class timeKeeper{
public static $json_filename = "abc.json";
public static $json_api_url = "https://example.com/api/?v=1.333";
public static function judge(){
$server_timestamp = time();
$server_time = date('Y/m/d H',$server_timestamp);
$json_timestamp = filemtime(self::$json_filename);
$json_time = date('Y/m/d H',$json_timestamp);
return $server_time === $json_time ? true : false;
}
public static function api_run($opts=null){
if(is_null($opts))return false;
$context = stream_context_create($opts);
$json = file_get_contents(self::$json_api_url, false, $context);
$fp = fopen(self::$json_filename, "w");
fwrite($fp,$json);
fclose($fp);
return self::json_load();
}
public static function json_load(){
$json = file_get_contents(self::$json_filename);
return json_decode($json, true);
}
public static function check(){
if(file_exists(self::$json_filename)){
return self::judge();
}
return false;
}
}
///使用例
if(timeKeeper::check()){
$json = timeKeeper::json_load();
}else{
$opts = array(
"http"=>array(
"method" => "POST",
"header" => "User-Agent: php"
)
);
$json = timeKeeper::api_run($opts);
}
著者名
@taoka_toshiaki
Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki
タグ
5.6, API, class, cron, hour, json, lt, php, public, timeKeeper, エラー, オブジェクト, キャッシュ, コード, こちら, サーバ, サイト, ソース, ダウンロード, ため, テスト, ファイル, プログラミング, ユーザー, リンク, 一, 上書き, 下記, 保存, 公開, 内容, 処理, 動作, 参考, 場合, 実行, 差異, 時刻, 時間, 更新, 案, 環境, 結果, 自分, 設定,