5

多分私はブラウザのdevツールから多すぎることを求めていますが... JSコードの相対的な行を見つけずに、単にdebuggerのステートメントを置かずにWebページの状態をフリーズする方法はありますか? (ないブラウザ固有の問題、これを行うことができます任意のブラウザが良いです)js "debugger"文を使わずにdomツリーの状態をフリーズする方法は?

後、私は私だけアクセス可能ですページ上のいくつかのDOMを検査したい状況がある:私は特定の上でクリックした

  • ボタン
  • ぼかしイベントの後に消えます(たとえば、インスペクタで親要素を見つけてクリックした場合、すぐに消えます)。

クリックでトリガするので、「強制的な要素状態」も役に立ちません。

ありがとうございます!

+1

[DOM要素のすべての変更についてデバッガで中断できますか?](http://stackoverflow.com/questions/3015197/can-i-break-with-debugger-on-all-changes- to-a-dom-element) – approxiblue

答えて

1

あなたは、その後変更されるインタフェースで含む要素を知っていれば、それを右クリックして「点検DOMの中の要素を右クリックし、 "Break On ..."> "Subtree modifications"(またはあなたに合った他のオプション)のいずれかを選択すると、 。

これは、DOM内の要素が変更されたときにJavaScriptの実行を一時停止し、F10などを使用してJSをステップ実行し、実行中の任意の時点でDOMを参照できるようにします。

変更する内容がわからない場合はもちろん、ページのダイナミックさによってはあまりにも多くの変更がキャプチャされる可能性がある場合は、<body>全体をこの方法で監視できます。

1

開発ツールでは、ブレークポイントをソースコードの任意の行に設定できます。 Visual Studioの場合と同じように動作します。

ブラウザを停止して再起動しても、ブレークポイントは有効のままです。 少なくともChrome/Firefox/Internet Explorerで動作します。それはシリアライズさした後

代わりに、あなたがオブジェクトの状態を記録することができます:Chromeの場合

console.log(JSON.stringify(state)) 
関連する問題