注册 | 登录 | 设为首页 | 加入收藏
您当前的位置:飞翔学院-IT中国 → 编程开发JavaScript → 文章内容

初识Firebug 全文 — firebug的使用

作者:Firebug 来源:Firebug 发布时间:2008-7-31 15:12:54
题,或者是电脑配置问题,或者是程序太慢,或者直说是他们的人品问题?不管怎么说,最后你可能被要求去解决这个有多种可能的问题。

网络状况监视器能帮你解决这个棘手问题。Firebug的网络监视器同样是功能强大的,它能将页面中的CSS、javascript以及网页中引用的图片载入所消耗的时间以矩状图呈现出来,也许在这里你能一把揪出拖慢了你的网页的元凶,进而对网页进行调优,最后老板满意客户欢喜,你的饭碗也因此而牢固。

网络监视器还有一些其它细节功能,比如预览图片,查看每一个外部文件甚至是xmlHttpRequests请求的http头等等。

图6:网络状况监视器
图6:网络状况监视器

Javascript调试器

这是一个很不错的javascript脚本调试器,占用空间不大,但是单步调试、设置断点、变量查看窗口一个不少。正所谓麻雀虽小,五脏俱全。

如果你有一个网站已经建成,然而它的javascript有性能上的问题或者不是太完美,可以通过面板上的Profile来统计每段脚本运行的时间,查看到底是哪些语句执行时间过长,一步步排除问题。

图7:javascript调试器
图7:javascript调试器

DOM查看器

DOM(Document Object Model)里头包含了大量的Object以及函数、事件,在从前,你要想从中查到需要的内容,绝非易事,这好比你去了一个巨大的图书馆,想要找到几本名字不太确切的小书,众多的选择会让你无所适从。而使用Firebug的DOM查看器却能方便地浏览DOM的内部结构,帮助你快速定位DOM对象。双击一个 DOM对象,就能够编辑它的变量或值,编辑的同时,你可能会发现它还有自动完成功能,当你输入document.get之后,按下tab键就能补齐为 document.getElementById,非常方便。如果你认为补齐得不够理想,按下shift+tab又会恢复原状。用了Firebug的 DOM查看器,你的javascript从此找到了驱使的对象,Web开发也许就成了一件乐事。

图8: Dom查看器
图8: Dom查看器

小结

Firebug插件提供了一整套web开发所必需的工具。从HTML的编写,到CSS样式表的美化调优,以及用javascript脚本开发,亦或是Ajax应用,Firebug插件都会成为你的得力助手。所谓工欲善其事,必先利其器。在Web2.0的时代,言必称Ajax,动辄就是用户体验提升,如果把Firebug工具用好,必能让你如虎添翼,将HTML、CSS、javascript整理得服服帖帖,从此成为web开发中的专家级人物。

Firebug的中文含义是萤火虫,作者是Joe Hewitt,官方网页 http://www.getfirebug.com
Firefox亦即火狐浏览器,是近年来撼动IE浏览器市场占有率的一支强大力量,要不是它的出现,我想有生之年说不定也看不到IE 7的发布了,官方网页 http://www.firefox.com

上一页  [1] [2] 


  • 打印文档
  • 推荐好友
  • 返回顶部
  • 增大字体
  • 减少字体
关于本站 | 工作机会 | 合作网站 | 广告服务 | 市场合作| 联系我们 | 抽奖活动
版权所有: 武汉威俊科技有限公司 Copyright 2005-2007 www.ITCNW.COM All rights reserved