ブラウザの対応状況に応じてW3C DOMとIE4 DOMを使い分けるスクリプトの書き方

機能テストによるDOMの使い分けとは

W3C DOMとIE 4 DOMのどちらにも対応できる柔軟なスクリプトを作成したい場合、「機能テスト（ケイパビリティ検出）」と呼ばれる手法を活用するのが効果的です。

このアプローチでは、まず特定のメソッドやプロパティが存在するかどうかをチェックし、その結果からブラウザが目的の機能をサポートしているかどうかを判断します。これにより、実行環境に応じて自動的に最適なDOM操作方法を選択できます。

コード例

以下は、機能テストを使ってDOMを切り替える基本的なコードスニペットです。

if (document.getElementById) {
    // W3C DOMのメソッドが存在する場合はこちらを使用
}
else if (document.all) {
    // all[] 配列が存在する場合はIE4 DOMを使用
}
else {
    // いずれも使えない場合はレガシーDOMを使用
}

コードの解説

このスクリプトの動作は、以下の流れで決定されます。

• document.getElementById のチェック： このメソッドが存在すれば、標準規格であるW3C DOMが利用可能と判断し、そちらを採用します。
• document.all のチェック： getElementById が存在せず、all[] 配列が存在する場合は、Internet Explorer 4系の独自実装であるIE4 DOMを使用します。
• フォールバック処理： どちらも利用できない環境では、レガシーなDOM（旧式のドキュメントオブジェクトモデル）にフォールバックします。

補足：現代のブラウザについて

なお、現在の主要なブラウザはすべてW3C DOM（特に document.getElementById）を標準サポートしているため、このような切り替え処理が必要になるケースはほぼありません。ただし、古いブラウザへの互換性を維持する必要があるレガシーシステムの保守などでは、今でも役立つ知識です。