デベロッパーツールのDOM Breakpointsを使う

y-ozaki 223views 更新:2014年6月13日

chromeのデベロッパーツールのDOM Breakpointsを使うことで要素が削除されるときや、属性が変わるときにブレークさせることができます。

まずF12でデベロッパーツールを表示します。Elementsのタブを開き、ブレークポイントを設定したい要素を選択します。

選択したら、右クリックで break on を選択し、Subtree modifications、Attributes modifications ,node removalの中から設定したいものを選択するとブレークポイントを設定できます。

Attributes modificationsを設定して、実際に属性が変わる動作をしたとき、その処理でブレークされ、デベロッパーツールのSourceタブが表示されます。右側にcallstackが表示されるので、デバックなどを行うときに、どのあたりで属性が変わる処理を行っているのかということが見つけやすくなります。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません