google-chrome - コンソールで Chrome DOM ブレークポイント イベントを手動でフックすることは可能ですか?

Question

現在、要素インスペクター ウィンドウから DOM 要素を右クリックし、[サブツリーの変更で中断] を選択できます。ブレークポイントは便利ですが、リアルタイムの統計も収集したいので、JS コンソール内からイベントをフックしたいと考えていました。つまり、実際に実行を中断するのではなく、コールバック関数を起動します。これは可能ですか？

Answer 1

次のようにイベントをバインドします。

// DOMNodeInserted may be more interesting
document.addEventListener('DOMSubtreeModified', function(event) {
    console.log(event.target);  // Logs the element
});

ログに記録された要素は「ライブ」であるため、ログの時点では要素は表示されません。DOMNodeInsertedイベントでは、次を使用すると便利な場合があります。console.log(event.target.outerHTML);