JavaScriptのデバッグ
JavaScriptを書くとき、デバッグツールがないと大変です。
JavaScriptのデバッグ
デバッグツールなしでJavaScriptプログラムを書くのは困難です。
コードには構文エラーや論理エラーが含まれている可能性があり、デバッグ ツールがなければ、これらのエラーを見つけるのは困難です。
通常、JavaScriptにエラーがあった場合、プロンプトメッセージが表示されないため、コードエラーの場所を見つけることができません。
ヒント: 新しい JavaScript コードを作成すると、多くの場合、エラーが発生します。
JavaScript デバッグ ツール
プログラム コード内のエラーを見つけることは、コード デバッグと呼ばれます。
デバッグは難しいですが、幸いなことに、多くのブラウザにはデバッグ ツールが組み込まれています。
組み込みのデバッグ ツールは開始またはオフにすることができ、重大なエラー メッセージがユーザーに送信されます。
デバッグ ツールを使用すると、ブレークポイント (コードの実行が停止する場所) を設定し、コードの実行中に変数を検査できます。
ブラウザでデバッグツールを有効にするには、通常、F12キーを押して、デバッグメニューで「コンソール」を選択します。
console.log() メソッド
ブラウザがデバッグをサポートしている場合は、console.log() メソッドを使用してデバッグ ウィンドウに JavaScript の値を出力できます:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <h1>我的第一个 Web 页面</h1> <p> 浏览器中(Chrome, IE, Firefox) 使用 F12 来启用调试模式， 在调试窗口中点击 "Console" 菜单。 </p> <script> a = 5; b = 6; c = a + b; console.log(c); </script> </body> </html>
プログラムを実行します試してみましょう
ブレークポイントを設定します
デバッグウィンドウでは、JavaScript コードにブレークポイントを設定できます。
各ブレークポイントで JavaScript コードの実行が停止し、JavaScript 変数の値を確認できるようになります。
確認後、コード(再生ボタンなど)を再実行することができます。
debugger キーワード
debugger キーワードは、JavaScript の実行を停止し、デバッグ関数を呼び出すために使用されます。
このキーワードは、デバッグ ツールでブレークポイントを設定するのと同じ効果があります。
デバッグが利用できない場合、デバッガーステートメントは機能しません。
デバッガを有効にすると、コードは 3 行目より前で実行を停止します。
えープログラムを実行して試してください
主要ブラウザ用のデバッグツール
通常、ブラウザでデバッグツールを有効にするには、F12キーを押してデバッグメニューで「コンソール」を選択します。
各ブラウザの手順は次のとおりです:
Chromeブラウザ
ブラウザを開きます。
メニューでツールを選択します。
「ツール」で「開発者ツール」を選択します。
最後に、[コンソール]を選択します。
Firefoxブラウザ
ブラウザを開きます。
ページにアクセスしてください:
http://www.getfirebug.com。指示に従ってください:
Firebugをインストールします。
Internet Explorer ブラウザ。
ブラウザを開きます。
メニューでツールを選択します。
「ツール」で「開発者ツール」を選択します。
最後に、[コンソール]を選択します。
Opera
ブラウザを開きます。
Opera の組み込みデバッグ ツールは Dragonfly です。詳細な手順については、ページ
http://www.opera.com/dragonfly/ を参照してください。
Safari
ブラウザを開きます。
マウスを右クリックし、「要素の検査」を選択します。
下部のポップアップウィンドウで「コンソール」を選択します。
