Firebug Lite - FF以外のブラウザーでFirebug機能
FirebugはFirefoxのAdd-onで、Firefoxブラウザーで閲覧しているWEBページのHTMLソース、CSS、Javascriptをリアルタイムに分析、編集、デバッグ、モニタする機能を備えていて、WEB開発者にとってとても欠かせない存在、非常に強力的なツールです。
こんな強力なツールなのに、残念ながら、IE、SafariなどのFirefox以外のブラウザーで使えません。
Firebug Liteは、Javascriptで実装したFirebugの機能の軽量版で、IE、Safari、OperaなどのブラウザーでFirebug機能を提供しようとしています。
◇DOM要素のインスペクト
◇XHRのトラッキング
◇HTML/CSS/JavaScriptインスペクタ
◇console.log機能
■方法一：ブックマークレットで動作
手順
①Firebug LiteのページをIEなどのブラウザーで開いてください。
②図で示したリンク「Firebug Lite」をブックマークする。
IEの場合、右マウスで次のリンクをクリックして、出てきたメニューに「お気に入りに追加（F）...」を選択します。
③IEなどのブラウザーで閲覧しているページをFirebug Liteで適応したい場合、ブックマークレット「Firebug Lite」をクリックします。
すると、ブラウザーの底部にFirebugのようなパレットが表示されます。
■方法二：getfirebug.comのfirebug-lite-compressed.jsをWEBページに追加
■方法三：Firebug Liteをダウンロード
利用する（offline）
firebug-lite-compressed.js もしくは firebug-lite.js 及び pi.jsをWEBサイトにインポート利用します。
方法二、三の場合、Firebugを表示するのに、F12を手動で押す必要があります。しかし、<html>要素にdebug="true"を設定すれば、ページを開くと、Firebug コンソールは常に表示されるようになります。
こんな強力なツールなのに、残念ながら、IE、SafariなどのFirefox以外のブラウザーで使えません。
Firebug Liteは、Javascriptで実装したFirebugの機能の軽量版で、IE、Safari、OperaなどのブラウザーでFirebug機能を提供しようとしています。
機能・特徴
◇DOM要素のインスペクト
◇XHRのトラッキング
◇HTML/CSS/JavaScriptインスペクタ
◇console.log機能
利用方法
■方法一：ブックマークレットで動作
手順
①Firebug LiteのページをIEなどのブラウザーで開いてください。
②図で示したリンク「Firebug Lite」をブックマークする。
IEの場合、右マウスで次のリンクをクリックして、出てきたメニューに「お気に入りに追加（F）...」を選択します。
③IEなどのブラウザーで閲覧しているページをFirebug Liteで適応したい場合、ブックマークレット「Firebug Lite」をクリックします。
すると、ブラウザーの底部にFirebugのようなパレットが表示されます。
■方法二：getfirebug.comのfirebug-lite-compressed.jsをWEBページに追加
<script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
■方法三：Firebug Liteをダウンロード
利用する（offline）firebug-lite-compressed.js もしくは firebug-lite.js 及び pi.jsをWEBサイトにインポート利用します。
<script language="javascript" type="text/javascript" src="/path/to/firebug/pi.js"></script> <script language="javascript" type="text/javascript" src="/path/to/firebug/firebug-lite.js"></script>
方法二、三の場合、Firebugを表示するのに、F12を手動で押す必要があります。しかし、<html>要素にdebug="true"を設定すれば、ページを開くと、Firebug コンソールは常に表示されるようになります。
<html debug="true">