「駑馬十駕」 IT系情報を中心に調べた事をコツコツ綴っています。

通常ブラウザにはF12押下でブラウザ標準の開発ツールが使用可能となりますが、今回紹介する「Firebug」は高性能なJavaScriptデバッガツールです。JavaScriptだけではなくHTMLやスタイルシートの値をリアルタイムに変更して確認したり、非同期通信状況やDOMの状態などの詳細情報確認も簡単に可能となります。

Firebugの特徴

  • Firefox専用のアドオン
  • JavaScriptのデバッグ
  • 非同期通信の状況確認
  • DOMやスタイルシートの設定状況確認

Firebugのインストール手順

  1. FireFoxを起動し、メニューの「ツール」→「アドオン」を選択します。
    Firebugインストール手順1
  2. アドオンマネージャのメニュー「アドオン入手」画面で検索ボックスへ「firebug」と入力して検索します。
    Firebugインストール手順2
  3. 検索結果に「Firebug x.xx.x」と表示されますので「インストール」ボタンを押下してインストールします。
    Firebugインストール手順3
  4. インストール終了後、デバッグしたい画面を開いてブラウザの右上に追加された「虫アイコン」をクリックすれば虫アイコンに色がついてFirebugが起動します。
    Firebugインストール手順4
    Firebugインストール手順5

Ads by Google

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">