IE8の開発者ツール
IE8からHTMLのレンダリング時に「ツール>開発者ツール」を選択することにより、HTML、CSSのダンプやスクリプトのデバッグ、プロファイリングを行うことの出来るGUIツールが起動できるようになっているが、これがなかなかに便利だ。
特に有りがたいのがこのツールの「検索>クリックして要素を選択」機能だ。
このチェックをオンにした以降、現在レンダリングされているHTMLのエレメントをポイントすることで青い枠線が表示されるので、そこでクリックすると、ツール上の対応するHTMLの行にジャンプする。
divタグがネストしていたり、FormがTableタグでレイアウトされていたりする場合、対象のエレメントは要素のかなり深い所にあったりするので、順にドリルダウンで探していくのは予想よりも面倒なことが多い。※
※他のブラウザにも同様の機能があるのかもしれないが、私は普段IEしか使わないので分からない。
追記:
IEはこの手の機能は大抵後発だが、やはりFirefoxのアドオンであるFireBugはこの機能を更に強力にしたデバッガを持っているようだ。
Firebug Firefox Add-ons
手隙になったら試してみよう。