逆に言うとAjaxは、テキストエディタさえあればプログラミングができてしまいます。しかもブラウザはどのパソコンにも標準でインストールされているので、すぐに実行することができます。ただブラウザだけではエラーの原因がわかり難いことが欠点です。
このAjax初心者入門講座で Firefox を使う理由の一つは Firebug が使えることです。 Firebug を使えば、エラーの原因がすぐにわかるので、デバッグを効率よく行なうことができます。
プログラミングにバグは付き物です。プログラミング初心者はエラーが出るとパニックになりますが、原因を特定して一つ一つ解決していけば大丈夫です。
今回はわざとプログラムを間違えてエラーを出してみましょう。エラー原因をブラウザで調べる方法がわかれば、エラーが出ても落ち着いて対応できます。
【1】「test.js」の13行目をわざと間違えます。result → resalt
resalt.innerHTML = "a + b = " + c;
変更したらファイルを保存してください。
【2】まず Internet Explorer6.0 で「test.html」を開きます。
*「\」はWindowsではエンマークのことです。
C:\ajax\sample001\test.html
JavaScriptのプログラムが間違っているので、ブラウザの画面には何も表示されません。またエラーメッセージも出ていません。これでは何が原因なのかわかりませんね。
【3】次は Firefox で「test.html」を開きます。
ブラウザの画面に何も表示されないのは同じですが、画面右下のステータスバーにエラーメッセージが表示されています。
【4】エラーメッセージをクリックします。
【5】Firebug が起動して、エラーの内容と行番号が確認できました。
実際にはこの情報をもとにデバッグしていきます。Firefox の方がデバッグに便利なことがわかったと思います。
【6】「test.js」の13行目を元に戻してください。忘れないでくださいね。
【解説】
実は Internet Explorer でもある程度のエラーメッセージは表示されます。
以下は別のプログラムで、わざとエラーが出るようにした状態です。Internet Explorer のステータスバーに警告アイコンが表示されます。ダブルクリックすると、
エラーメッセージが表示されます。
【ワンポイント】
Firefox は日々改良されています。更新があると以下のようなメッセージが表示されるので、「Firefox を今すぐ再起動」ボタンをクリックして更新してください。
作業中なら「後で」ボタンをクリックすると、Firefox を次回起動時に更新できます。