その日の日付を、特定の形式のテキスト(String)で欲しい場合の JavaScript のサンプルです。
今回は年を西暦、月と日を二桁で表示し、それらをハイフンで繋いだ形式(YYYY-MM-DD)で得る例を紹介します。
サンプルコード
以下のサンプルでは、スクリプトで得た日付を date タイプの input タグの初期値として設定しています。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>YYYY-MM-DDの日付をテキストフィールドに表示</title>
</head>
<body>
<form>
<input type="date">
</form>
</body>
<script>
// 現在の日付をYYYY-MM-DDの形式で取得
function getCurrentYYYYMMDD() {
var date = new Date();
var y = date.getFullYear();
var m = ("00" + (date.getMonth() + 1)).slice(-2);
var d = ("00" + date.getDate()).slice(-2);
return [y, m, d].join("-");
}
// 得られた日時を input の初期値として設定
var dateControl = document.querySelector('input[type="date"]');
dateControl.value = getCurrentYYYYMMDD();
</script>
</html>
関数 getCurrentYYYYMMDD が、今日の日付をYYYY-MM-DDの形式に変換したテキストを返します。
この関数は、年、月、日をそれぞれ取得し、月日は2桁になるようにゼロ埋めをしています。最後にこれらを join によってハイフンで繋いでいます。
ハイフンをスラッシュなど別の区切り文字にすることもできますが、サンプルのように input の初期値とする場合はハイフンである必要があります。
結果、ページは以下のように表示されます。
その日の日付がデフォルト値として設定された日付用入力フィールドが表示されます。
以上、YYYY-MM-DD形式の日付を得る JavaScript のスクリプトについてでした。