はじめに
ブラウザの種類やバージョン、ブラウザ固有の実装の違いを考慮し、同じように動作するスクリプトを「クロスブラウザスクリプト」と言います。本連載では、クロスブラウザスクリプトを実現する方法について順を追って解説します。
クロスブラウザを実現する方法の一つに、「JavaScriptを実行するブラウザの種類やバージョンを判断し、そのブラウザに合わせたスクリプトを実行する」という方法があります。JavaScriptは、ブラウザの種類やバージョンによってサポートされている内容が異なることがあるため、ブラウザを判断し、その違いを吸収することは、クロスブラウザを実現する上でとても重要です。
ブラウザの種類やバージョンを判断するためには、navigatorオブジェクトを使います。navigatorオブジェクトには、ブラウザに関する基本的な情報がプロパティとして収められています。この連載でも、前回はnavigatorオブジェクトのuserAgentプロパティを、前々回はappNameプロパティを使って、ブラウザや、ブラウザが実行されているOSの種類を判断する方法を解説しました。
navigatorオブジェクトは、ブラウザ自身の素性を表すユーザエージェント情報の全部、あるいは一部をオブジェクトとして持っています。これらの情報は、ブラウザを判断する時の重要な材料となります。しかし、このユーザエージェントの情報は素直にブラウザ自身を表していない場合が数多く、一筋縄ではいきません。このことは、ブラウザが開発されバージョンアップを重ねて来た経緯に、多いに関係があります。
今回は、まずJavaScriptの種類と対応するブラウザの関係を明確にすると共に、navigatorオブジェクトが所有する「ブラウザの判断に使用できるプロパティ」を紹介します。そして、各ブラウザのユーザエージェントの特徴についても解説します。
今回解説する内容（特にユーザエージェントに関して）は、一見クロスブラウザスクリプトと関係ないように思えるかもしれません。しかし、ブラウザ切り分けのテクニックの基礎となる、とても重要な部分です。
JavaScriptとブラウザの関係
まず始めに、どのブラウザが、どのバージョンのJavaScriptをサポートしているかを表1にまとめます。これを知ることは、クロスブラウザスクリプトを作る上での基礎であり、大変重要です。現在JavaScriptはバージョン1.5までが公開されています。JavaScriptは基本的に下位互換が取れているため、JavaScript 1.5をサポートしているブラウザであれば、一部の例外を除き、それ以下のバージョンのJavaScriptもサポートしています。
| JavaScriptの種類 | 対応ブラウザ | 特徴 |
| JavaScript 1.0 | Netscape Navigator 2.0以降、Internet Explorer 3.0以降 | ブラウザのウィンドウを操作するwindowオブジェクトや、日付を取り扱うDateオブジェクトなど、基本的なオブジェクトが既に規格化されています。 |
| JavaScript 1.1 | Netscape Navigator 3.0以降、Internet Explorer 4.0以降 | 画像を取り扱うImageオブジェクトがサポートされました。これにより、ページ表示後の画像置き換えが可能になりました。 |
| JavaScript 1.2 | Netscape Navigator 3.0以降、Internet Explorer 4.0以降 | ディスプレイサイズなど、ディスプレイに関する情報を持つscreenオブジェクトが追加されました。Netscape Navigatorでは、ウィンドウ上に絶対座標でコンテンツの位置を設定したり、重なりを指定することができるLayerオブジェクトが追加されています。また、Netscape Navigator、Internet Explorerとも、JavaScriptを使ってスタイルシートを操作することが可能です。 |
| JavaScript 1.3 | Netscape Navigator 4.06、Internet Explorer 5.0以降 | 文字コードがUNICODEになったほか、日付を取り扱うDateオブジェクトで年号が4桁で表せるようになったり、ミリセコンド単位の時間を扱えるようになったり、といった細かな部分で追加・変更が行われています。これらの処置は、ECMAScript（ECMA-262）の第1版と互換をとるためのものです。 |
| JavaScript 1.4 | なし | ECMAScriptの第1版と完全互換のスクリプトです。JavaScript 1.4を搭載したブラウザは、結局発表されませんでした。 |
| JavaScript 1.5 | Netscape Navigator 6以降、Internet Explorer 5.0以降、Opera、Safari | ECMAScriptの第3版と完全互換をとったスクリプトです。ナビゲータオブジェクト、ビルトインオブのうち、JavaScript 1.5として規格化されているのは、ECMAScriptと同様に、ビルトインオブジェクトの部分のみです。しかし、DOMをコントロールする方法は規定されているので、DOM化されたブラウザであれば、DOMの各要素に対し、JavaScriptを使ってアクセスし、値の取得、変更が可能です。 |
表の中で、ECMAScriptというスクリプトが出てきています。このECMAScriptは、ヨーロッパの標準化機関であるECMA（European Computer Manufacturers Association）によって、インターネットで使用することを目的として標準化されたスクリプト言語です。ECMAScriptは、もともとJavaScript 1.1をベースとして規格化が進められ、現在、ECMA-262として仕様が一般に公開されています。
ECMAScriptは、本来ブラウザで使われることを目的としていました。しかし、今では標準的なスクリプト言語として、ブラウザだけでなく、一般のアプリケーションでもサポートされるようになり、現在では、JavaScript対応をうたったブラウザやアプリケーションが数多く発表されています。しかし、これらのブラウザやアプリケーションは、正確にはJavaScript対応ではなく、ECMAScript対応といった方がよいのかもしれません。
ECMAScriptでは、JavaScriptの手法を用いて、DOM（Document Object Model）にアクセスする方法を規定しています。また、Netscape NavigatorやInternet Explorer、Opera、Safariなどの最新版のブラウザはDOM化されているため、JavaScriptの手法を用いてDOMにアクセスし、設定されている値を変更することによって、HTMLファイルが表示された後でも表示内容を動的に変更することができます。このように、ブラウザの表示を動的に変更する手法を「Dynamic HTML」と言います。そしてこれをさらに一歩進めたものが「Ajax」です。Ajaxでは、サーバ間通信のインタフェースの一部にJavaScriptを使うことによって、効率よく通信を行い、かつその結果を動的に表示します。
しかし、JavaScriptの実装やDOMの実装は、ブラウザの種類やバージョン、OSの種類によって異なります。これらの違いを吸収するためにも、ブラウザの種類やバージョンの判断は重要なのです。
