DHTMLの登場はWeb上の表現力を大幅に向上するものでありました。
しかしそれと同時に、異なるブラウザ間でその実現方法の違いが問題となりました。
例えば文字一つを動かす方法についても、IEとNetscapeの間では、
似たような形式でコードを書きますが、
細部を見るとその実現方法が異なっている事に気がつきます。
つまりIE向けのDHTMLコードと、Netscape向けのDHTMLコードの間には完全な互換性は無い事になります。
多くのWebページ製作者にとっては、
より多くの方にコンテンツを見て欲しいと願う事でしょうから、
おのずとその２つのブラウザ両方で動くDHTMLを開発する事になると思います。
Cross Browserという言葉は、異なるブラウザ間でも同様の挙動を目指すコードの書き方、考え方を示します。
Cross Browserによる開発では、その異なるブラウザ間で、如何にその両者の仕様の違いを吸収しながら
効率よい開発を出来るかと言う事が、重要視されます。
ここではCross BrowserなDHTMLの書き方について、一つの紹介をしたいと思います。
以下のリンクを参考にして下さい。
IE - MSDN online DHTML,HTML & CSS (Microsoft/英語)
IE - DHTML References (Microsoft/英語)
NN6 - W3C DOM Level-1 (W3C/英語)
NN6 - W3C DOM Level-2 (W3C/英語)
現在、Cross Browserな Cross BrowserなDHTMLを作る事において、まず念頭に入れておかなければならない重要な事は、
また、ある場合には正直割り切る事もありかと思います。
IEとNN6の間には、大きなコードの改変も無くコードの記述が出来る場合が多いですが、
それらとNN4の間で互換性を実現しようとした場合、
予想以上にDHTMLの開発に手間取る事があります(NN4のCSS関連のバグも考慮して)。
その場合多少割り切って、NN4の対応を見送るのも選択肢の一つだと思います。
ただしその場合も、NN4で正常にコンテンツが見れるようにする必要性はあるでしょう。
クロスブラウザのDHTMLを作成するにあたって、その開発を容易にする為に、
幾つかのサイトにてフリーのライブラリが配布されています。
JavaScriptサンプル集でお馴染みの
高橋氏
の提供するDynamicHTMLcross-browser/Examplesの
"Free Functions"などがその主な代表です。
氏以外にも色々な方が製作・配布なされているので
Linksなどから辿ってみてください。
このようなライブラリを利用する事により、汎用的なコード記述の手間が大幅に省けます。
互換性のあるDHTMLを実現するにあたって、 スクリプトの中で、ブラウザごとに分岐する必要性が出てきます。 その際各ブラウザの判別は以下の様に行います。
var isIE = document.all; //IEの判別
var isNN4= document.layers; //Netscape4の判別
var isDOM= document.getElementById; //Netscape6以降、IE5.0以降の判別
スクリプトの中で上記の様に定義すると各変数にboolean値が入ります。 例えば、IE4.0で実行した場合は isIE4 のみが true を返し（その他の変数は false を返します。)、 IE5.0で実行した場合は、isIE と isDOM に true が入ります。 この変数を利用して以下の様にスクリプトの分岐を行います。
if(isIE) {
//IE4.0以上の時の処理
}
else if(isNN4) {
//NN4.xの時の処理
}
else if(isDOM) {
//NN6以降の時の処理
}
機能による簡易対応表です。主な機能別にわけてあります。