HTML5のMicrodata APIとは？getItems()によるブラウザ対応判定の方法

HTML5マイクロデータの2つの側面

HTML5のマイクロデータ（Microdata）標準は、大きく分けて2つの要素で構成されています。1つ目はHTMLマークアップそのもので、これは主に検索エンジン向けのものです。もう1つは一連のDOM関数群で、こちらは主にブラウザでの操作を想定して設計されています。

未対応環境でもマークアップは安全

Webページにマイクロデータの属性を記述しても、マイクロデータを理解しない検索エンジンやブラウザは、それらの属性を単純に無視するだけです。そのため、マークアップを追加すること自体がページの表示や動作に悪影響を与えることはありません。

しかし、JavaScriptからDOM経由でマイクロデータにアクセスしたり、その内容を操作したりしたい場合は話が変わります。この場合、あらかじめ利用するブラウザがマイクロデータDOM APIに対応しているかどうかを確認しておく必要があります。

getItems()関数による機能判定

ブラウザがHTML5マイクロデータAPIをサポートしている場合、グローバルなdocumentオブジェクト上にgetItems()関数が存在します。逆に、マイクロデータ非対応のブラウザでは、getItems()関数はundefined（未定義）となります。

この仕組みを利用すると、次のようなシンプルな関数で対応の有無を判定できます。

function supports_microdata_api() {
    return !!document.getItems;
}

ここでは二重否定演算子「!!」を使い、document.getItemsの存在を真偽値（true / false）に変換しています。getItems関数が存在すればtrueが返り、存在しなければfalseが返ります。

このような手法は「機能検出（フィーチャーデテクション）」と呼ばれ、ユーザーエージェント文字列でブラウザを判別するよりも確実で推奨される方法です。実際にマイクロデータを操作するコードを実行する前に、この判定関数を呼び出して対応状況を確認しておくと安心です。