firebug 是个非常流行且相当给力的WEB开发工具,优点举例如下:
1)它可以实时监控HTML标签、样式定义、界面布局;
2)它使用了增强版的 JavaScript 调试器,并适用于任意浏览器;
3)它可以精确的分析网络使用情况,甚至性能分析;
4)它的扩展性强,可以让更多人的在它的基础上写出更好的插件;
本案例将以访问百度首页为例。
打开浏览器,按下 F12,将弹出 firebug 控制台,此时你在网页中输入百度首页回车,你将看到该首页有打印一些信息。
该信息正是使用了脚本 console.log 代码,那我们怎么知道它的来源与出处呢,答案在图中。
概况可以获取当前页面引用到的 JavaScript 脚本的时间执行情况。
将标签切换至【HTML】,你将看到的是 HTML 代码;
如果你想看一下【百度一下】这个按钮是怎么定义的,请看图解步骤。
切换到【网络】标签,你将看到该网址涉及到的所有HTML、JS、图片 等等,关于颜色的定义是这样的,红色代表无法访问,灰色表示从浏览器缓存中读取,黑色表示网络中加载。
firebug 还有更多的功能,比如 调试、console api、command api 等等,限于篇幅,无法一次讲全,届时将在下次分享。