Total Pageviews

Sunday 1 July 2012

强大的开发工具-firebug

Chrome 浏览器上安装了 Firebug ,再一次感受到 Firebug 的强大。无论您是否了解过这只“萤火虫”,或者您已经是骨灰级的用户了,当我们回过头来看的时候,不得不感激她为我们的前端开发工作带来的便利。
      如今的 Firebug 已经不仅仅是 Mozilla Firefox 浏览器的开源扩展了,现在在 Chrome 浏览器上也增加了 Firebug 插件应用了。好吧,如此强大的开发者工具,我已经离不开了。
      Firebug 可以做些啥?
      Firebug 提供了很多工具,可以监视、编辑和调试任何 Web 站点的样式表(CSS)、HTML、文档对象模型(DOM)和 Javascript。她包括一个 Javascript 控制台、一个日志记录 API 以及一种非常有用的网络监视器。借助 Firebug ,可以很快便了解到页面的结构和CSS 盒子模型,可以轻松地调试 Javascript 和 Ajax 应用程序。
      如何获得 Firebug 支持?
      如果您是 Firefox 用户,可以通过以下方法添加组件:
      菜单栏 -> 工具 -> 添加组件 -> 获取添加组件 -> 搜索 Firebug -> 点击安装就好。
      如果您是 Chrome 用户,可以通过以下方法添加组件:
      菜单 -> 工具 -> 扩展程序 -> 获得更多扩展程序 -> 搜索 Firebug -> 点击安装就好。
      在我们安装完 Firebug 之后,一般都需要重启浏览器的。随后,在您的 Firefox 右下角(或者 Chrome 的右上角)就会出现一只灰色的“萤火虫”。Firebug 默认是禁用的,需用您手动去开启他。开启了之后,您就可以学习使用,让他成为您开发的小助手了。
      如何学习使用 Firebug 呢?
      哈哈,这个问题,很容易解决,为了方便您学习,下面有 2 个链接希望能帮助到您。加油吧,Firebug 很容易使用的。
      Firebug 基本功能介绍
      Firebug 官方网站
      我的个人感觉呢,还是需要在实践中使用上 Firebug 才比较现实些,至于如何去学习,如何去发挥好 Firebug 的功能,你懂的。
      其他一些辅助的工具
      Firebug 已经很强大了,但还有更多的强大工具加入到这个队伍中来。好吧,在 firefox 上,你还可以增加 YSlowFireCookies。个人特别喜欢用的辅助工具还有 Web Developer 和 Chrome 上的 Monster
      我的心得
      从一开始学习 HTML 和 CSS 的时候,我就经常使用 Firebug 了。如今越来越发现离不开 Firebug 等的前端开发工具了,工具的发明提高了我们工作的效率.
------------------------------------------------------------------------

相关帖子:https://briteming.blogspot.com/2017/10/firefoxfirebugjs.html
---------------------------------------------------------------------------------------

网页开发利器Firebug

Firebug是一款Firefox下的开发调试开源插件,功能包括HTML查看和编辑、Javascript控制台、网络状况监视器,网站整体分析,是开发JavaScript、CSS、HTML和 Ajax的得力助手。Firebug也是一个除错工具。用户可以利用它除错、编辑、甚至删改任何网站的 CSS、HTML、DOM 以及JavaScript 代码 。

主要功能介绍:
控制台(Console)功能:控制台得主要作用是用来显示网页各类错误信息,同时可以在进行javascript调试的时候当作命令行窗口使用。
HTML功能:此菜单标签功能,主要用于查看当前页面的源代码功能,并可进行编辑,实时显示,从而实现页面最佳效果。
CSS功能:点击CSS菜单标签,可查看所有的CSS定义信息,同时也可以通过双击来达到修改页面样式的效果。
Javascript脚本功能:脚本功能主要是一个脚本调试器,可以进行单步调试、断点设置、变量查看等功能,同时通过右边的监控功能来实现脚本运行时间的查看和统计。
DOM功能:该功能主要用于查看页面DOM信息,通过提供的搜索功能实现DOM的快速准确定位,并可双击来实现DOM节点属性或值的修改。
网络(Net)功能:该标签功能主要用来监控网页各组成元素的运行时间的信息,方便找出其中运行时间较慢的部分,进一步优化运行效率。

[repo owner=”firebug” name=”firebug”]