このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

time”要素:日付や時刻HTML5で追加

記事May 12th,2015
July 7th,2020
日付や時刻、時間を機械可読な形式で表す要素
この記事はHTML Living Standardに対応しています。
この記事はHTML Living Standardに対応しています。

要素について

カテゴリー フロー・コンテンツフレージング・コンテンツパルパブル・コンテンツ
利用場所 フレージング・コンテンツが置ける場所
内容 datetime”属性を指定した場合、フレージング・コンテンツ
datetime”属性を指定しない場合、テキスト(ただし、機械可読な形式の日時や時間)
タグの省略 不可

time”要素は日付や時刻、時間を機械可読な形式で表す要素です。

通常の文章中の日時や時間はコンピューターには読み取られませんが機械可読な形式で表すことによってカレンダー登録機能や検索エンジンなどが利用することができます。

datetime”属性を指定しない場合は“time”要素は機械可読な形式の日付や時刻であるテキスト以外を含むことはできません。

サンプルコード

<p>彼は<time>17:36</time>に彼女から別れを告げられた。</p>

彼はに彼女から別れを告げられた。

属性と値

属性
属性 説明 説明
必須属性
なし
任意属性
グローバル属性
datetime="" 機械可読な形式の日付や時刻、時間 日時や時間 機械可読な形式の日付や時刻、時間

機械可読な形式の日時

日付

yyyy-mm-dd”の形式で記述します。日を省略した“yyyy-mm”の形や年を省略した“mm-dd”の形でも記述できます。

機械可読な形式
2012-3-4 2012年3月4日
2012-3 2012年3月
3-4 3月4日

時刻

hh-mm-ss”の形式で、時間は24時間表記(“0~23”)で記述します。秒数を省略した“hh-mm”の形でも記述できます。

機械可読な形式
12:34 12時34分
12:34:56 12時34分56秒
12:34:56.789 12時34分56.789秒

年の後に“W”をつけた週番号を記述する“yyyy-Www”の形式で記述します。

機械可読な形式
2015-W12 2015年第12週

日時

日付と時刻を“T”で区切った“yyyy-mm-ddThh-mm-ss”の形式、もしくは半角スペース(“ ”)で区切った“yyyy-mm-dd hh-mm-ss”の形で記述します。

機械可読な形式
2012-3-4T12:34 2012年3月4日12時34分
2012-3-4 12:34
2012-3-4T12:34:56 2012年3月4日12時34分56秒
2012-3-4 12:34:56
2012-3-4T12:34:56.789 2012年3月4日12時34分56.789秒
2012-3-4 12:34:56.789

日時の末尾に協定世界時(UTC)の場合は“Z”、協定世界時以外の場合は“±hhmm”か“±hh:mm”の形で協定世界時との時差を加えるとタイムゾーンを記述することができます。

機械可読な形式
2012-3-4T12:34Z 2012年3月4日12時34分(協定世界時・UTC)
2012-3-4T12:34+0000
2012-3-4T12:34+00:00
2012-3-4 12:34Z
2012-3-4 12:34+0000
2012-3-4 12:34+00:00
2012-3-4T12:34+0900 2012年3月4日12時34分(日本標準時・UTC+9)
2012-3-4T12:34+09:00
2012-3-4 12:34+0900
2012-3-4 12:34+09:00

所要時間、経過時間

週(“w”)、日(“d”)、時間(“h”)、分(“m”)、秒(“s”)にそれぞれ単位をつけて半角スペース(“ ”)で区切って記述、もしくは“P”、日(“D”)、“T”、時間(“H”)、分(“M”)、秒(“S”)にそれぞれ単位をつけて続けて記述します。

機械可読な形式
P9DT3H45M6S 1週間、2日と3時間45分6秒
P1DT23H45M6S 1日と23時間45分6秒
PT12H3M45S 12時間3分45秒

仕様書

time”要素はHTML5から定義されている要素です。現行の仕様であるHTML Living Standardでも定義されています。

定義されている仕様書
HTML 4 HTML 5 HTML 5.1 HTML 5.2 HTML Living Standard
<time>
定義なし

定義あり

定義あり

定義あり

定義あり
DOMインターフェース
[Exposed=Window]
interface HTMLTimeElement : HTMLElement {
[HTMLConstructor] constructor();

[CEReactions] attribute DOMString dateTime;
};
UAスタイルシート
@namespace url(http://www.w3.org/1999/xhtml);

/* なし */
一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク