JavaScriptで日付をフォーマットする方法｜基本の4つの形式とサンプルコード
JavaScriptの日付フォーマットの種類
JavaScriptでは、Dateオブジェクトを扱う際に、いくつかの標準的な日付フォーマットが使用されます。主なフォーマットは以下の4種類です。
| 日付の種類 | フォーマット例 |
|---|---|
| ISO形式（国際標準） | "2017-11-29" |
| 短い日付形式（Short Date） | "11/29/2017" |
| 長い日付形式（Long Date） | "29 Nov 2017" |
| 完全な日付形式（Full Date） | "Wednesday November 29 2017" |
この中でもISO形式（YYYY-MM-DD）は国際標準規格「ISO 8601」に準拠した形式で、ブラウザ間の互換性が高く、データの保存や通信にも適しているため、JavaScriptで日付を扱う際には最も推奨されています。
現在の日付を表示するサンプルコード
続いて、ボタンをクリックするとnew Date()で現在の日付を取得し、画面に表示する簡単なデモを紹介します。
<!DOCTYPE html>
<html>
<body>
<p>下のボタンをクリックすると現在の日付を取得できます：</p>
<button onclick="display()">日付を表示</button>
<p id="test"></p>
<script>
function display() {
var date = new Date();
document.getElementById("test").innerHTML = date;
}
</script>
</body>
</html>実行結果について
このコードを実行してボタンをクリックすると、Dateオブジェクトがそのまま文字列化されて表示されます。出力は次のような形式になります。
Wed Nov 29 2017 10:15:30 GMT+0900 (日本標準時)
このように、Dateオブジェクトを直接表示すると環境によって見た目が変わるため、実務ではtoISOString()メソッドを使ってISO形式（"2017-11-29"）に変換したり、独自の関数で「YYYY年MM月DD日」のような形式に整形したりするのが一般的です。
-
JavaScriptオブジェクトの内容を文字列として表示する方法
JavaScriptでオブジェクトの内容を文字列形式で画面に表示したい場合、document.getElementById()でHTML要素を取得し、innerHTMLを使って書き出すのが基本的な方法です。オブジェクトを文字列に変換するには、JSON.stringify()メソッドを活用します。 実装手順 まず、表示先となるHTML要素にIDを設定します。次に、JavaScript側でそのIDを指定して要素を取得し、変換した文字列をinnerHTMLに代入します。 コード例 <!DOCTYPE html> <html lang="ja"> <h
-
JSPで日付をフォーマットする方法！fmt:formatDateタグの使い方を徹底解説
JSTL（JSP Standard Tag Library）には、日付や時刻をさまざまな形式で表示するための<fmt:formatDate>タグが用意されています。このタグを使うことで、Javaコードを直接記述することなく、JSPページ内で簡単に日付の整形が可能です。fmt:formatDateタグの主な属性<fmt:formatDate>タグでは、以下の属性を指定できます。属性説明必須デフォルト値value表示する日付の値はいなしtypeDATE（日付のみ）、TIME（時刻のみ）、BOTH（両方）のいずれかいいえdatedateStyleFULL、LONG、MEDIU