マシンリーダブルな値をあらわす。
要素一覧
| 要素 | 概要 |
|---|---|
<data> |
Microdataと組合せてマシンリーダブルな値を表す。 |
<time> |
マシンリーダブルに日時を表す。 |
| 属性 | 概要 |
|---|---|
data-* |
データ属性では任意の属性と値を付与できる。JavaScriptで操作可能。 |
<data>
<data value="マイナンバーID">山田太郎</data>
<data value="10000">一万</data>
日付の場合、<time>要素のほうがよい。
<time>
時刻
<time datetime="2022-01-01T12:34:56+09:00">2022年1月1日 12時34分56秒</time>
時間
<time datetime="PT3D4H18M3S">3日間4時間18分3秒</time>
schema.orgとの組合せ
<article itemscope itemtype="http://schema.org/BlogPosting"> <h1 itemprop="headline">記事の見出し</h1> <footer>公開日：<time itemprop="datePublished" datetime="2022-01-01"></time>三ヶ月前</footer> <p itemprop="articleBody">本文。</p> </article>
data-*
標準外の属性と値を付与できる。
index.html
<p id="content" data-some="なんか">本文。</p>
main.js
const p = document.getElementById('content'); console.log(p.dataset.some); // なんか
まとめ
<time>は国によって異なる日時の表現をしつつ、共通形式も書いておくことで機械的に読み取ることができる。ブログだと更新日時などに使える。
<data>は日時以外で機械的に読み取りたいもの。
data-*属性は、どの要素にも付与できるグローバル属性である。CSSやJavaScriptから参照できる任意のキーと値をセットできる。パフォーマンスが遅くなる点に注意。
対象環境
- Raspbierry pi 4 Model B
- Raspberry Pi OS buster 10.0 2020-08-20 ※
- bash 5.0.3(1)-release
$ uname -a Linux raspberrypi 5.10.63-v7l+ #1496 SMP Wed Dec 1 15:58:56 GMT 2021 armv7l GNU/Linux
