エラーメッセージを表示させる JavaScript
JavaScriptで起きたエラーに対処するためには、エラーメッセージを表示させる必要があります。各ブラウザでどのように表示をされるのか紹介します。
今回使用するソースコード
今回は下記のソースコードを使用します。アラートに「Hello World !!」と表示させる、お勉強用でおなじみのソースコードです。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>Hello World</title>
<script type="text/javascript">
//<![CDATA[
window.alert('Hello World !!); //エラー箇所
//]]>
</script>
</head>
<body>
</body>
</html>
ただし、文字列を表す「'（シングルコーテーション）」が抜けている記述ミスがあり、ブラウザで実行するとエラーになります。さて、各ブラウザでこのエラーに対するメッセージを表示確認するにはどうしたらいいのかやってみましょう。
FireFox でエラーメッセージを表示
FireFoxで表示させてもJavaScriptの構文エラーが起きているのでアラート表示はされません。そしてその構文エラーに対するエラーメッセージもでません。
エラーの確認方法
メニューバーの［ツール］→［エラーコンソール］でエラーメッセージを表示します。
エラーコンソール画面にエラー内容が表示されます。
エラーリンクをクリックすることで詳細箇所が表示されます。
FireBug でエラーメッセージを表示
FireFoxの拡張機能であるFireBugでのエラー確認方法。
FireBugを表示させ、［コンソール］タブを表示させます。もしここでコンソールが無効化されていたら、有効化します。
コンソールを有効化した直後はエラー内容を表示しませんので、ページを再読み込みしましょう。
エラーコンソールの時と同様にエラーリンクをクリックすることで詳細箇所を表示します。
Internet Explorer でエラーメッセージを表示
Internet Explorerで表示させると、ページ下部にあるステータスバーの左にエラーが起きていることを表す「！」アイコンが表示されています。
エラーの確認方法
「！」アイコンをクリックするとエラーメッセージを表示します。
エラーメッセージ内の［詳細表示］ボタンを押すとエラー箇所を指摘してくれます。
ページ表示と同時にエラーメッセージを表示させる場合は、メニューバーの［ツール］→［インターネットオプション］を選択します。
「詳細設定」タブのブラウズカテゴリにある［スクリプトエラーごとに通知を表示する］にチェックを入れます。
ただ、この設定を行うとエラーを見つけるたびにエラーメッセージが表示されるので、インターネット閲覧時には非常に鬱陶しいです。制作時のみチェックを入れたほうがいいと思います。
Safari でエラーメッセージを表示
Safariで表示させてもJavaScriptの構文エラーが起きているのでアラート表示はされません。そしてその構文エラーに対するエラーメッセージもでません。
エラーの確認方法
［Safari設定アイコン］→［メニューバーを表示］を選択します。
メニューバーの［編集］→［設定］を選択します。
［詳細］アイコンをクリックして表示される画面の［メニューバーに"開発"メニューを表示］にチェックを入れます。
メニューバーの［開発］→［エラーコンソールを表示］を選択します。
リソーストラッキングの画面が表示された場合は［常に有効］を選択して［リソーストラッキングを有効にする］ボタンを押してください。
エラーコンソールアイコンを選ぶとエラーメッセージが表示されます。
エラーリンクをクリックするとエラー内容の詳細を表示できます。
Google Chrome でエラーメッセージを表示
Google Chromeで表示させてもJavaScriptの構文エラーが起きているのでアラート表示はされません。そしてその構文エラーに対するエラーメッセージもでません。
エラーの確認方法
［Google Chrome設定アイコン］→［ツール］→［JavaScriptコンソール］を選択します。
JavaScriptコンソールが表示され、エラーメッセージを確認できます。エラーリンクをクリックすることで詳細箇所を表示します。
