和田憲幸のブログ

札幌市白石区在住、個人事業のWebエンジニア 和田憲幸(43歳)のブログです。

Javascriptのデバッグしてる?

初期設定ではどのブラウザもJavascriptのエラーを報告してくれません。

2009-04-09 08:48:09
入力時間 / 09:21

Microsoft Script Debugger

IEをはじめ多くのブラウザではJavascriptの挙動に不具合があった場合も、通常通りレンダリングされてしまうため、一般的に見過ごされがちなJavascriptのエラー。IEだと左下のステータスバーに黄色いビックリマークでエラーが表示されるんですが、様々なサイトで見過ごされているのをご存知だろうか。

近年、Javascriptのライブラリが隆盛している裏ではJavascriptの知識の無い人が設置した事によって様々なエラーがブラウザの裏で発生しているのだ。あら怖い。いや、別に怖くはないんだけど。だからデベロッパは最低限、Javascriptのデバッガを有効にしようよ。格好悪いじゃない。自分のサイトでJavascriptエラーが出てたらさぁ。

Javascriptデバッガ

SafariやFirefoxにはデバッグコンソールってのが付いているので、デバッグコンソールを見ればどこでエラーが発生しているかすぐわかりますよね。では今回はIEでのデバッグ環境の実装について。Microsoft Script Debuggerというソフトをインストールします。んで、ツール → インターネットオプション → 詳細タブを開きます。「スクリプト エラーごとに通知を表示する」にチェックして、「スクリプトのデバッグを使用しない(Internet Explorer)」「スクリプトのデバッグを使用しない(その他)」のチェックを外して再起動。

これでIE環境でもどこでエラーが発生しているかわかるようになります。Script Debugger自体強力なデバッガではないため、エラーがどの行で発生しているか程度しかわからないんですが、ある程度知識があればその行がどこからの干渉によって発生しているかはわかるようになるかと。

メールフォームでもけっこうあるんですがメールフォームプロはjqueryを使っているため、prototypeとコンフリクトするんですよね。そのほか、どこの馬の骨ともわからんようなライブラリとコンフリクトする場合も結構あるため、ライブラリの実装には最低限の知識が必要なんです。Web系の雑誌では「ライブラリは簡単」とライブラリを押していますが使う側は最低限の知識を得ておくのが妥当でしょう。実際に数多くのエラーを吐き出してるのはライブラリなんで。

と、いうことでぜひJavascriptを勉強している方はデバッグ環境は整えて置いてくださいね。

TAG

P.231

つくしさん
和田様
非常に参考になります!!
IEでの閲覧時のあのデンジャーそうなびっくりマークは出た瞬間、びっくりします。
最近、めっきり見なくなったブラウザクラッシャーを思い出してしまいます・・・。

いやぁー、さりげないワンポイントが含まれてるので、和田様のブログは好きです。2009-04-09 10:34:14
和田
>つくしさま
たまにはタメになることを書かないと・・・。てへっ。2009-04-09 16:16:12