45

javascript ライブラリに入ることなく、Google Chromes 開発者ツールを使用して JavaScript コードを 1 行ずつ実行するにはどうすればよいですか?

たとえば、私は自分のサイトで jQuery を多用しており、jquery ライブラリ内の javascript/jquery ではなく、自分が作成した jQuery をデバッグしたいだけです。自分の jquery/javascript だけをステップ実行し、jquery ライブラリの何百万行もステップ実行する必要がないようにするにはどうすればよいですか?

したがって、次のものがあれば:

function getTabFrame() {
    $.ajax({
        url: 'get_tab_frame.aspx?rand=' + Math.random(),
        type: 'GET',
        dataType: 'json',
        error: function(xhr, status, error) {
            //alert('Error: ' + status + '\nError Text: ' + error + '\nResponse Text: ' + xhr.responseText);
        },
        success: function(data) {
            $.each(data, function(index, item) {
                // do something here
            });
        }
    });
}

ブレークポイントを に配置する$.ajax({と、停止した場所でデバッグを開始し、F11 キーを押すと、jQuery ライブラリに直接移動します。私はそれが起こらないようにしたくない、私はそれが次の行に行きたいurl: 'get_tab_frame.aspx?rand=' + Math.random(),.

代わりに F10 を押してみましたが、}そのまま関数を閉じてしまいます。そして F5 は、各行を 1 つずつステップ実行せずに次のブレークポイントに移動します。

4

2 に答える 2

87

Windowsマシンで実行していると仮定します...

  1. F12キーを叩く
  2. Scripts開発者ツールで、またはSources、タブを選択します
  3. 最上位にある小さなフォルダー アイコンをクリックします。
  4. JavaScript ファイルを選択します
  5. 左側の行番号をクリックしてブレークポイントを追加します (小さな青いマーカーを追加します)。
  6. JavaScript を実行する

次に、実行のデバッグ中に、いくつかのステップ動作を実行できます...

  • F8続行: 次のブレークポイントまで続行します
  • F10ステップ オーバー: 次の関数呼び出しをステップ オーバーします (ライブラリには入りません)。
  • F11ステップ イン: 次の関数呼び出しにステップ インします (ライブラリ 入ります)。
  • Shift + F11ステップ アウト: 現在の関数からステップ アウトします。

アップデート

更新された投稿を読んだ後; コードをデバッグするには、jQuery Development Source Codeを一時的に使用することをお勧めします。これで問題が直接解決されるわけではありませんが、デバッグがより簡単になります。あなたが達成しようとしていることについては、ライブラリに足を踏み入れる必要があると思いますので、製品コードが何が起こっているのかを解読するのに役立つことを願っています.

于 2012-05-17T14:56:30.960 に答える
27

...Google Chromes 開発者ツールを使用して、javascript ライブラリに移動せずに、JavaScript コードを 1 行ずつ実行するにはどうすればよいですか?...


記録として: 現時点 (2015 年 2 月) では、Google Chrome と Firefox の両方に、ライブラリやスクリプトの中に入ることを避け、関心のあるコードを超えるために必要なものが正確に備わっています。これは、ブラック ボクシングと呼ばれます。

ここに画像の説明を入力

ソース ファイルをブラックボックス化すると、デバッグ中のコードをステップ実行するときに、デバッガーはそのファイルにジャンプしません。

より詳しい情報:

于 2015-02-11T18:00:22.437 に答える