web-dev-qa-db-ja.com

ブラウザで消える要素を検査するにはどうすればよいですか?

マウスが離れると消える要素を検査するにはどうすればよいですか? Example dropdown which disappears

私はそれがIDかクラスか何かを知りませんが、それを調べたいです。

私が試した解決策:

コンソール$('*:contains("some text")')内でjQueryセレクターを実行しますが、主に要素が非表示ではなく、おそらくDOMツリーから削除されているため、運がありませんでした。

DOMツリーの変更を手動で検査しても、何が変更されたかを知るには速すぎるように思えるので、何も得られません。

成功:

イベントブレークポイントで成功しました。具体的には-私の場合はマウスダウン。 ChromeでSources-> Event Listener Breakpoints-> Mouse-> mousedownに移動します。その後、検査したい要素をクリックし、Scope Variablesの中にいくつかの有用な指示がありました。

105
lukas.pukenis

(この回答はChrome Developer Toolsにのみ適用されます。)

消えている要素を含む要素を見つけます。要素を右クリックして、「Break on ...> Subtree Modifications」を適用します。これにより、要素が消える前にデバッガーの一時停止がスローされ、一時停止状態の要素と対話できるようになります。

enter image description here

135
arxpoetica

Chromeの代替方法:

目的の要素が表示されている間に、F8(またはCtrl + /)を押します。これにより、DOMをそのままの状態でフリーズしながらスクリプトの実行が中断されます。

そこからCtrl + Shift + Cを使用して、つかの間の要素を選択できます。

64
Joseph Tinoco

Macでchromeを使用していますが、上記の手順に従いましたが、もう少し説明しようと思います。

  1. 右クリックして、要素の検査に進みます。
  2. [ソース]タブに移動します。
  3. 次に、要素にカーソルを合わせます。
  4. 次に、キーボードF8またはCommand(Window) \を使用します。静的な状態で画面を一時停止し、要素がホバーアウトしても消えません。
6
Black Mamba

Firebugには、これに対するさまざまなソリューションがあります。

  1. HTMLパネル内で Break On Mutate を使用できます。 (これにより、どの要素であるかを知ることもできます)
  2. 要素を右クリックして、Firebugで要素を検査するを選択できます。

また、特定のイベントを一時的にブロックする方法を要求する issue 551 に従うこともできます。

編集:

どの要素かを調べるには、 HTMLパネルオプション変更の強調表示変更の展開およびビューにスクロール変更して、HTMLパネル内に要素を表示します。

セバスチャン

2

私の場合、Google Chromeで再帰的に展開するオプションを使用しました:

手順は次のとおりです。

  1. ドロップダウンフィールドを調べる
  2. ダイナミックDOMを見つける(紫色のハイライト)
  3. その動的DOMを右クリックします
  4. を選択して再帰的に展開しますenter image description here
  5. すべての要素がそこにあることがわかります

デモは次のとおりです。

enter image description here

1
Raja David

マウスで要素にカーソルを合わせ、F8(Chromeではこれ)を押してスクリプトの実行を一時停止します。ホバー状態は表示されたままになります。

[ソース]タブに移動します。 [要素]タブに戻ります。今回のコードは消えません。

0

私は同じ問題を抱えていましたが、Firefoxを使用して、検査要素を開くとすぐに消えます:4つのダッシュ(設定)を開き、Web開発者>デバッガに移動し、すぐにスクリプトを停止する一時停止のショートカットであるF8を押します開発ツールを開いたことを検出して検出する前に

0
Hani Yassine

インスペクターの要素の下に表示される要素と消える要素を表示できます。表示されている要素に移動すると、ステータスが変化したときに要素が消えたり、CSSが変化したりするのを見ることができるはずです。

これは、firefoxのfirebugまたはchromeのビルド済みインスペクターで可能です。

0
matpol