The Mouseover DOM Inspector, or MODI for short, is a favelet (also known as a bookmarklet) that allows you to view and manipulate the DOM of a web page simply by mousing around the document.

ブックマークレットで簡単起動できるDOMインスペクタ。
次のように、カーソルを合わせた部分のHTML要素の属性についてサクっと知ることができます。


( 上記はブログのタイトル画像にカーソルを合わせて、画像の属性について表示させているところ )

FirefoxのFireBugにも同様の機能が存在しますが、IEでも使えるのでIEをお使いの方にはなかなか便利かも。

インストールは簡単で、「Bookmark this link for MODIv2」をお気に入りに追加してブックマークレットとして使用するだけです。



使い方は、DOM要素を解析したいページ上で、ブックマークレットを起動するだけです。
ブックマークレットを起動すると、ウィンドウが立ち上がるので、後は調べたい要素にカーソルを合わせます。

関連エントリ

• IE上でDOMやCSSを書き換え可能な拡張「DOM Helper」
• WebデザイナーのためのFirefoxエクステンション20個
• JavaScriptデバッグツール集