2017-10-20 2 views
0

devtoolsでDOM内の要素を見つけることができません。Chrome devtools:親にマウスがある場合にのみ表示される項目の要素を検査します。

要素は、その要素の上にマウスを置いた場合にのみ表示されます。コードでは、上にマウスを置いて、javascriptを使用すると、多くのクラスがさまざまな要素に追加され、子要素のみが表示されます。 (ホバリングイベントはなく、jsでマウスオーバーするだけです)

クラスが非常に多いので、手動で追加することはできません。このコンテキストで要素を検査してデバッグするにはどうすればよいですか? Chromeはどんなヘルプを提供しますか?

ありがとうございます!

+0

問題を確認できるように、コードを入力してください。 特定の要素をホバリングする必要がある場合は、コンソールでイベントをトリガーすることができます(マウスは、後でイベント状態を変更しないように、ビューポートの外側にある必要があります)。 – zoku

+0

@zokuそれはホバリングではない、それはjavascriptでマウスオーバーです。 –

+0

マウスを離すと要素が削除されますか? –

答えて

0

はいChrome devtoolshover/mouse over要素を処理するツールは画像を参照している:あなたのイベントはそのように接続されている場合

enter image description here

+0

ありがとう、それはマウスではなく、マウスを動かすだけです。私には、それはマウスオーバーJavaScriptイベントで動作しません –

1

を: document.getElementById('idOfYourElement').addEventListener('mouseover', function(){ console.log('hover'); })

あなたがプログラムでそのようなイベントをトリガすることができます。 document.getElementById('idOfYourElement').dispatchEvent(new Event('mouseover'))

マウスがビューポートの外にある場合、この状態に留まり、dev-toolsでデバッグできます。

関連する問題