現在主に使われているブラウザはIE4〜6・NN4・Netscape6・Mozillaであるが、これらのブラウザは実装に違いがある。 共通の操作では DHTML が不可能であるが、あえてリンクにカーソルが重なったときにドキュメント上にメッセージを表示するようにする。
01 <A href="http://www.w3c.org" onMouseOver="showMsg('メッセージ')" onMouseOut="showMsg('')">The World Wide Web Consortium</A>
02 <DIV id="message">
03 </DIV>
カーソルが重なったときと外れたときに、関数 showMsg() を呼び出します。重なったときには表示するメッセージを、 外れたときには空白の文字列を引数で渡しています。これによってカーソルの重なったときのみメッセージが表示されます。
メッセージを表示するための領域です。操作のためにIDがつけられています。このIDに対して、CSS の position プロパティの値を absolute にすることで、NN4では LAYER として扱われます。なお、このプロパティの設定により下の行と重なってしまうため、下の行の上マージンを広げてあります。最下行である場合はこの処理は不要です。
01 function showMsg(msg)
02 {
03 if(document.getElementById)
04 {
05 layerObj = document.getElementById("message");
06 if(layerObj.firstChild)
07 {
08 layerObj.firstChild.nodeValue = msg;
09 }
10 else
11 {
12 layerObj.appendChild(document.createTextNode(msg));
13 }
14 }
15 else if(document.all)
16 {
17 message.innerHTML = msg;
18 }
19 else if(document.layers)
20 {
21 document.message.document.open();
22 document.message.document.write(msg);
23 document.message.document.close();
24 }
25 }
DOM が扱えるブラウザの処理。
IDが message のオブジェクトを取得。
取得したオブジェクトに子ノード（この場合はテキストノード）が含まれていたら、その中身をメッセージで置き換える。
子ノードがなければ、メッセージを中身とするテキストノードを新たに作って加える。
DOM が扱えないIEの処理。メッセージ用エレメントの中身をメッセージで置き換える。
NN4の処理。レイヤーに対して、メッセージを書き込む。最後は必ず閉じないと、そのまま処理町になってしまうので注意が必要です。