ホームページ > ウェブフロントエンド > jsチュートリアル > Chrome+JS はブレークポイントのデバッグを実装します

Chrome+JS はブレークポイントのデバッグを実装します

php中世界最好的语言
リリース: 2018-04-18 10:56:40
オリジナル
1780 人が閲覧しました

今回は Chrome+JS でブレークポイントデバッグを実装する場合の注意点を紹介します。実際の事例を見てみましょう。

ヒント 2: ブレークポイントの場所にすばやくジャンプします

右側の ブレークポイント には、JS ファイル内でヒットしたすべてのブレークポイントがまとめられています。チェックボックスと同じ行をクリックすると、ブレークポイントが一時的にキャンセルされ、チェックボックスの次の行をクリックすると、次の行に直接ジャンプします。ブレークポイントの場所

ヒント 3: ブレークポイントの内部スコープを表示する [非常に実用的]

右側のスコープでは、これが指す場所、値があるかどうか、ブレークポイントがオブジェクトであるか他の何かであるかなど、多くの実用的な情報が表示されます。

ヒント 4: イベントのブレークポイントをリッスンする

右側のイベント リスナー ブレークポイントは、キーボード入力やドラッグなど、特定のタイプの動作イベントを選択的に監視できます。 。前のチェックボックスをオンにして有効にすると、動作の変更をトリガーすると、トリガーされた JS

にジャンプします。 ヒント 5: DOM と XHR モニタリングのジャンプ

DOM ブレークポイント: これは、DOM の特定のセクションに何らかの動作があると思われますが、正確な場所はわかりません

XHR ブレークポイント: サーバーからリクエストされた ajax のコアポイント

すべての XHR 動作はデフォルトでチェックされ、オプションのオプションで URL を決定します。 。 。あまり使いません

ヒント 6: シングルステップ実行、シングルステップエントリ、強制エントリ、シングルステップ終了

これはデバッグに不可欠です。実際、firebug を使用したことのある友人はこれを明確に理解しているでしょう。基本的に同じです;

関数の名詞が順番に並んでいます。理解できない場合は、私の firebug シリーズを見てください

  • 。 スクリプト実行の一時停止 [シングルステップ実行、ブレークポイントで一時停止、デバッグを待機 - 文字通りの翻訳ではありません]: 一時停止後、このボタンはスクリプト実行再開 [実行継続]、ショートカット キー [F8 または Ctrl +] になります

  • ステップ次の関数呼び出し [シングルステップ スキップ]: 次のブレークポイントにジャンプします。ショートカット キー [F10 または Ctrl + `]

  • 次の関数呼び出しにステップインします [シングルステップ エントリ]: の内部デバッグに入ります。関数、ショートカット キー [ F11 または Ctrl + ;]

  • 現在の関数からステップアウト [シングルステップ アウト]: 現在のブレークポイントの関数からジャンプします。ショートカット キー [Shift + F11 または Ctrl + Shift + ;] ]

後者はChromeの特別な機能です

  • ブレークポイントを非アクティブにする: すべてのブレークポイントを一時的に無効にします。ショートカット キー [Ctrl + F8]

  • 例外で一時停止しない: 式で一時停止しないでください。[例外をキャッチしたときに一時停止する - 例外がスローされた場合] オプションもあります。そこで一時停止する必要があります]

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

vue.jsモバイルターミナルはプルアップロードとプルダウンリフレッシュを実装します

JSONBuddyの詳細なインストール手順

以上がChrome+JS はブレークポイントのデバッグを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート