js调试工具firebug的使用

一、firebuglite官网： http://getfirebug.com/firebuglite

 

二、firebuglite在线版的使用：复制firebuglite官网上firebug Lite的链接地址，将其粘贴到浏览器的地址栏上，就可以使用firebuglite了。

 

具体操作：

1、复制以下链接的地址：

   
  

  复制出来的内容：

 

 

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');

 

2、正在调试的浏览器窗口如下：
 

3、将复制的内容粘贴到该浏览器窗口的URL地址栏上，点击回车键，firebug窗口就出来了：

 

 

4、将出现firebug窗口的浏览地址收藏到浏览器的收藏夹内，这样下次调试时，就可以直接使用了。

 

三、firebuglite脱机版的使用：

 

1、下载firebuglite，并解压到xtest/js/目录下

 

2、修改之前复制的内容为如下内容，粘贴该内容到浏览器，并添加到收藏夹，就可以脱机使用firebuglite了。

 

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','/build/firebug-lite.js','/skin/xp/sprite.png','http://localhost:8080/xtest/js/firebug-lite/','#startOpened');

 

 

四、firefox浏览器中可安装firebug插件来进行js的调试：

 

打开firefox浏览器-->工具-->附加组件-->在搜索栏中输入:firebug-->在搜索出来的firebug列表中点击安装-->安装后重启firefox-->按F12键可启动firebug插件。

 

五、 调试工具firebug打开后，可以用console来打印提示信息：

    

console.log("Log"); //打印log信息 
console.info("Info"); //打印info信息
console.dir({name:"CJ",age:18}); //传一个对象,firebug会将该对象的属性遍历出来 
console.warn("Warn!!!"); //打印警告信息 console.error("Error!!!"); //打印错误信息