2008/07/27

Firebug Lite が DOMインスペクタをサポート


Firebug Lite via Ajaxian

 

現在のWeb開発では、Firefox のアドオンである Firebug を使用することが多くなっていると思います。

 

ですが、他のブラウザでは Firebug の ログ出力機能である console.log() がエラーになってしまうため、他のブラウザでも console.log() を使用できるようにする Firebug Lite という JavaScript ライブラリがあります。

 

この Firebug Lite のバージョンが 1.2 になり、なんとDOMインスペクタをサポートするようになりました。これはとても便利ですね。

 

以下のような簡単なHTMLを複数のブラウザで表示するとどのようになるか調べてみました。

 
   

<html>    
<head>      
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />      
  <title>Firebug Lite 1.2 Test</title>      
  <script type='text/javascript'      
    src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'>      
  </script>      
  <script>      
    console.log("console.log() のテストです。");

   

    var obj = new Object();    
    obj.field1 = "field1";      
    obj.field2 = "field2";      
    obj.date = new Date();      
    console.log(obj);      
  </script>      
</head>      
<body>      
<h1>Firebug Lite 1.2 Test      
</h1>      
<p>Firebug Lite 1.2 からは、DOMインスペクタがサポートされました。</p>      
<p>これで、Firefox, IE, Opera, Safari でも console.log と DOMインスペクタが簡単に利用できるようになりました。</p>      
</body>      
</html>

 

■Firefox

 

Firefox では Firebug を使用すればよいのですが、Firefox でも Firebug Lite は問題なく動作しました。Firefox のバージョンは 3.0 になります。

 

Firebug Lite on Firefox

 

DOMインスペクタ。

 

Firebug Lite DOM Inspector on Firefox

 

 

 

■Internet Explorer

 

Internet Explorer 7 も問題なさそうです。

 

Firebug Lite on IE7

 

DOMインスペクタ。

 

Firebug Lite DOM Inspector on IE7

 

 

 

■Opera

 

Opera 9.5 でも問題なさそうです。

 

Fiebug Lite on Opera

 

DOMインスペクタ。

 

Firebug Lite DOM Inspector on Opera

 

 

 

■Safari

 

Windows版Safari 3 でも問題なさそうです。

 

Furebug Lite on Safari

 

DOMインスペクタ。

 

Firebug Lite DOM Inspector on Safari

 

 

 

■JavaScriptコンソール

 

Firefox/Opera/Safari では、複数行書けるJavaScriptコンソールがついていました。IEでも1行のみの実行は可能です。

 

Javascript コンソール

 

 

 

スポンサーリンク


このエントリーをはてなブックマークに追加




Twitter ではブログにはない、いろんな情報を発信しています。


コメント

コメントを書く



プロフィール

  • 名前:fnya
    経歴:
    SE としての経験は15年以上。様々な言語と環境で業務系システム開発を行い、セキュリティ対策などもしていました。現在は趣味SE。

    Twitter では、ブログでは取り上げない情報も公開しています。


    ブログについて

    このブログは、IT、スマートフォン、タブレット、システム開発などに関するさまざまな話題を取り上げたり、雑感などをつづっています。

    現在、Enty で支援を受け付けています。もしよければご支援ください。



    >>ブログ詳細
    >>自作ツール
    >>運営サイト
    >>Windows 10 まとめ

    Twitter のフォローはこちらから Facebook ページはこちら Google+ページはこちら RSSフィードのご登録はこちらから