にしし ふぁくとりー:西村文宏 個人サイト

"JavaScript Tips Factory" : Presented by Nishishi. Since 1997.

ページの最終更新日を表示する方法 [日付・時刻]

JavaScriptを使ってウェブページの最終更新日時を得るには、document.lastModifiedプロパティを使います。日付の表記形態を細かく指定したい場合は、lastModifiedで得られる文字列から一旦Dateオブジェクトを作って、getFullYearなどのメソッドを使って日付や時刻を個別に得ます。

ページの最終更新日を表示する方法(?)

JavaScriptには、そのページが最後に更新された日時「最終更新日時」を得る方法が用意されています。例えば、以下のように記述します。

document.lastModified;

上記のようにdocumentオブジェクトのlastModifiedプロパティを参照するだけで、とても簡単です。
画面に表示したいのであれば、以下のようにHTML&JavaScriptソースを記述すると良いでしょう。

document.write( "最終更新:" + document.lastModified );

上記のソースを実際に表示させると、以下のように見えます。

……たぶん、現在時刻が表示されていますね。(^_^;)
このページはPHPで動的に生成されていますから、そもそも最終更新日時は常に現在日時になってしまいます。
まあ、動的に生成しているページなのであれば、その動的に生成しているスクリプト側で更新日時を取得すれば良いのでJavaScriptを使う必要性はないでしょう。
静的に作成されたHTMLファイルの更新日時を表示したい場合だけで使って下さい。

では、静的に生成されたHTMLファイルの更新日時であれば問題なく取得できるのかというとそうとも言えないのですが。その理由は以下の通りです。

HTTPレスポンスヘッダに「Last-Modified:」項目がなければ現在時刻が返されてしまう

このdocument.lastModifiedプロパティは、HTTPレスポンスヘッダに含まれる「Last-Modified:」項目がそのまま返される仕様のようです。HTTPレスポンスヘッダにこの項目がない場合は、単純に現在時刻が返ってきてしまいます
……ううーん、なかなか使い勝手がよろしくないですね。^^; せめて、HTTPレスポンスヘッダに「Last-Modified:」項目がない場合は空文字が返される、とかだったらif文で判別して活用しようがあるのですが。

静的に生成されたページの最終更新日をSSIで確実に表示する方法

静的に生成されたHTMLファイルの更新日時なら、SSIで取得してしまうのが確実です。SSIを有効にしないといけませんから、JavaScriptほど手軽ではありませんけども。
SSIの解説は本題ではないので詳しい解説は省きますが、SSIが有効になっているHTML内で以下のように記述すれば、そのページの更新日時を表示(挿入)できます。この場合、引数次第では自ページ以外の更新日時も得られます。

<!--#config timefmt="%Y年%m月%d日 %H時%M分%S秒" -->
<!--#flastmod virtual="target.shtml" -->

上記では、target.shtmlの更新日時を「2017年06月07日 13時18分05秒」のような書式で表示できます。
#configの行は1度記述すればそれ以降のすべてで有効です。virtual="ファイルパス"では更新日時を得たいファイルを相対パスか、「/」で始まる絶対パスで指定します。「http://」などで始まるURLは書けません。

JavaScriptで更新日時が取得できた場合に、日付の書式を自由に指定したい場合

さて、lastModifiedプロパティを参照することでJavaScriptで正しく更新日時が得られた場合、使われる日付の表記形態はブラウザや環境によって異なる可能性があります。
もっと細かく表示形態や表示内容を指定したい場合は、以下のように記述することもできます。

JavaScriptソース

var modified = new Date(document.lastModified);
var year = modified.getFullYear();
var month= modified.getMonth() + 1;
var date = modified.getDate();
document.write( "最終更新:" + year + "年" + month + "月" + date + "日" );

上記では、lastModifiedプロパティで得られる「最終更新日時」を元にしてDateオブジェクトを作成しています。
そして、getFullYearメソッド・getMonthメソッド・getDateメソッドを利用して、年月日の値を個別に取得しています。
こうすると、最後に自由自在に組み合わせて、好きな形態で更新日時を表示できます。
上記のソースを実際に表示させると、以下のように見えます。

まあ、このページでは現在時刻しか表示されないわけですけどもね。(^_^;;;
なお、時刻も含めた日付表記に関しては、別途「今日の日付・時刻を表示する方法」で詳しく解説していますので、そちらをご参照下さい。

()

JavaScript TIPSふぁくとりーの主要なカテゴリ

下記のカテゴリに区分して、JavaScriptに関するTIPSを公開しています。カッコ内の数字は、該当する記事の件数です。

著者紹介


にしし(西村文宏)

にししでございます。本書いたり記事書いたりしてます。あと萌えたり。著書5冊発売中です(Web製作系4冊+小説1冊)。著書や記事は「西村文宏」名義。記事は主にAll Aboutで連載。本の最新刊は2011年3月に発売されたライトノベルでございますよ。

Twitter:にしし/西村文宏
にしし/西村文宏 on facebook にしし/西村文宏 on mixi フォローはお気軽に!

にしし(西村文宏)連絡先
☕ コーヒーをおごる

著書一覧と詳細

関連するかもしれない情報など

▼このページに関連しそうな記事が約8本くらい自動表示されています。(たぶん)

--- 当サイト内を検索 ---